如何从动态创建的textinputs React-Native获取值

时间:2017-06-16 06:34:58

标签: javascript android ios react-native

我用xml样式来获取json obj:

"template": {
"xmlui": {
  "vbox": {
    "hbox": {
      "label": {
        "@value": "",
        "@attributes": {
          "value": "SOME VALUE"
        }
      },
      "textField": {
        "@value": "",
        "@attributes": {
          "width": "325",
          "name": "PLAT",
          "value": "IP",
          "maxLength": "80",
          "enabled": "true",
          "interactive": "false",
          "required": "true"
        }
      }
    },
    "tbox": {
      "vbox": [
        {
          "label": {
            "@value": "",
            "@attributes": {
              "value": "SOME MORE VALUE"
            }
          },
          "dropDownList": {
            "item": [
              {
                "@value": "",
                "@attributes": {
                  "value": "NO",
                  "text": "NO"
                }
              },
              {
                "@value": "",
                "@attributes": {
                  "value": "YES",
                  "text": "YES"
                }
              }
            ],
            "@attributes": {
              "width": "200",
              "name": "ISP_PROIZV",
              "value": "NO",
              "maxLength": "8",
              "enabled": "true",
              "interactive": "false",
              "required": "true"
            }
          }
        },
...

我尝试在屏幕上查看这些项目

handleMyData(keyIn, data){
//console.log(keyIn, typeof data, data.hasOwnProperty('@attributes'), tableItems.length);

let fields = ['hbox', 'tbox', 'vbox'];
if (typeof data == 'object' && data.hasOwnProperty('@attributes') && fields.indexOf(keyIn) == -1) {
  if (keyIn == 'label') {
    tableItems.push(
      <Text>{data['@attributes'].value}</Text>
    );
  } else if (keyIn == 'textField') {
    //this.setState({text: data['@attributes'].value});
    tableItems.push(
      <TextInput value={this.state.text}
                 placeholder={data['@attributes'].tip}
                 disabled={data['@attributes'].enabled == 'false'}
                 onChangeText={(text) => this.setState({text})}
                 ref= {(el) => { this.text = el; }}
      />
    );
  } else if (keyIn == 'date') {
    if (Platform.OS == 'ios') {
      tableItems.push(
        <DatePickerIOS
          date={moment(this.state.date)}
          onDateChange={this.handleOnDateChange}
        />
      );
    } else {
      tableItems.push(
        <DatePicker
          onComplete={this.handleOnDateChange}
          enabled={data['@attributes'].enabled == 'true'}
          value={data['@attributes'].value}
        />
      );
    }
 } else if (keyIn == 'dropDownList') {
    this.pickerRender(data, data['@attributes'].value);
}
  for (let key in data) {
  let value = data[key];
  //console.log(key, value instanceof Array);
  if (value instanceof Array) {
    for (let i = 0; i < value.length; i++) {
      this.handleMyData(key, value[i]);
    }
  } else if (typeof value === 'object' && value !== null) {
    this.handleMyData(key, value);
  }
}
},

pickerRender(data){
let pickerItems = [];
if (data.item instanceof Array) {
  for (let i = 0; i < data.item.length; i++) {
    let next = data.item[i];
    pickerItems.push(
      <Picker.Item
        key={'key' + i}
        label={next['@attributes'].text}
        value={next['@attributes'].value}
      />);
  }
} else {
  pickerItems = this.pickerPush(data);
}
tableItems.push(
  <Picker
    onValueChange={(value) => this.handleOnPickerChange(value)}
    selectedValue={this.state.pickerSelect}
    mode="dialog"
  >{pickerItems}
  </Picker>);
},

如何从这些元素中获取值并放入1个对象? 我试图添加ref键,但可能是我犯了一个错误。

1 个答案:

答案 0 :(得分:0)

pushInOpt(name, text){
let obj = {
  name: name,
  value: text
};
let flag=false;
if (options.length == 0){
  options.push(obj);
}else {
  for (let i = 0; i < options.length; i++) {
    if (options[i].name == name) {
      options[i].value = text;
      flag=true;
    }
  }
  if (flag==false){
    options.push(obj);
  }
}   
},

自己决定,只需在参数onEndEditing,onValueChange等中添加推送功能