كتابة متحكمات الاحداث بشكل افضل

نقوم بعمل دالة تقوم بتعديل قيمة الحقل في ال state هذا هو المثال بالشرح 

import * as React from 'react';
import { Button, Text, TextInput, View } from 'react-native';

export default class InsuranceInformation extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      inputs: [
        // أولاً نضيف معرفات لكل حقل لكي نستهدف الحقل به وفي حالتنا سيكون id
        { id: 1, type: 'text', label: 'الأسم الأول', value: '' },
        { id: 2, type: 'text', label: 'الأسم الثاني', value: '' },
        { id: 3, type: 'date', label: 'تاريخ الميلاد', value: '' },
        { id: 4, type: 'text', label: 'العنوان (1)', value: '' },
        { id: 5, type: 'text', label: 'العنوان (2)', value: '' },
        { id: 6, type: 'number', label: 'رقم الجوال', value: '' },
        { id: 7, type: 'text', label: 'رقم البطاقة', value: '' },
        { id: 8, type: 'number', label: 'رقم التأمين السابق', value: '' }
      ]
    };

    this.handleSubmit = this.handleSubmit.bind(this);
  }

  updateFieldValue = (id, value) => {
    // نقوم بالبحث عن الحقل الذي نكتب فيه ونعدل قيمته 
    const modifiedInputs = this.state.inputs.map(input => {
      if(input.id === id) {
        input.value = value;
      }

      return input;
    })

    // ثم نعطي الحقول بالتعديلات الجديدة لل state
    this.setState({ inputs: modifiedInputs })
  }

  handleSubmit(e) {}

render() {
  const { title } = this.props;

  return (
    <View>
    <Text>{title}</Text>
    {
    this.state.inputs.map(input => (
      <TextInput
        value={input.value}
        // نقوم بعمل دالة تقوم بتعديل قيمة الحقل في ال state
        onChangeText={text => this.updateFieldValue(input.id, text)} 
        placeholder={input.label} 
      />
      ))
    }
    <Button
      onPress={this.handleSubmit}
      title="إرسال" 
    />
  </View>
	);
  }
}