Javascript 在react native中的选择器值更改调用函数或数组

在这里，我试图做的是，对选择器值进行更改，调用函数并尝试调用循环和绘制5 TextInput，但得到错误。请帮我纠正这个小错误，当我试图直接调用myloop数组时，改变它的生成错误，数组不能作为函数调用

import * as React from 'react';
import { Text, View, StyleSheet, Alert, Picker } from 'react-native';
import { Constants } from 'react-native';
import { TextInput } from 'react-native-gesture-handler';

var myloop = [];
;
export default class UiDynamic extends React.Component {

  // add a selectValue to your state to stop the overwriting
  state = {
    PickerValueHolder: [],
    selectedValue: ''
  }

  componentDidMount() {
    // remove the return 
   fetch('http:///Dsenze/userapi/inventory/viewinventorytype', {  
        method: 'POST',
        headers: {
          'Accept': 'application/json',
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({
          "username" :"admin",
          "password" :"admin"
        })
      }).then((response) => response.json())
      .then((responseJson) => {
        // use the inventoryTypeData as it is already an array
       let PickerValueHolder = responseJson.inventoryTypeData;
        console.log("Array data" , PickerValueHolder)

        this.setState({ PickerValueHolder }); // Set the new state
      })
      .catch((error) => {
        console.error(error);
      });
    }

onPickerValueChange=()=>{

    {myloop}
    console.log("Picker change" , myloop);
    //  this.onPickerValueTextinput();

    }

  render() {

        for (let i = 0; i < 5; i++) {

            myloop.push(
              <View key={<TextInput></TextInput>}>
              <TextInput style={{ textAlign: 'center', marginTop: 5 }} 
              placeholder="Enter your name ">
              </TextInput>
              </View>
            )
            }


    return (
      <View style={styles.container}>

      {/* {myloop} */}

        {<Picker
                selectedValue={this.state.selectedValue}
               onValueChange={this.onPickerValueChange}>
                { this.state.PickerValueHolder.map((item, key)=>
                  <Picker.Item label={item.name} value={item.name} key={key} />
                )}
              </Picker>}
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
    padding: 8,
  }
});

import*as React from'React'；
从“react native”导入{Text，View，StyleSheet，Alert，Picker}；
从“react native”导入{Constants}；
从“反应本机手势处理程序”导入{TextInput}；
var myloop=[]；
;
导出默认类UiDynamic extends React.Component{
//将selectValue添加到您的状态以停止覆盖
状态={
PickerValue持有者：[]，
selectedValue:“”
}
componentDidMount（）{
//拆下回油阀
取（'http:///Dsenze/userapi/inventory/viewinventorytype', {  
方法：“POST”，
标题：{
“接受”：“应用程序/json”，
“内容类型”：“应用程序/json”，
},
正文：JSON.stringify({
“用户名”：“管理员”，
“密码”：“管理员”
})
}).then（（response）=>response.json（））
.然后（（responseJson）=>{
//使用inventoryTypeData，因为它已经是一个数组
让PickerValueHolder=responseJson.inventoryTypeData；
log（“数组数据”，PickerValueHolder）
this.setState（{PickerValueHolder}）；//设置新状态
})
.catch（（错误）=>{
控制台错误（error）；
});
}
onPickerValueChange=（）=>{
{myloop}
log（“选择器更改”，myloop）；
//this.onPickerValueTextinput（）；
}
render（）{
for（设i=0；i<5；i++）{
myloop.push(
)
}
返回(
{/*{myloop}*/}
{
{this.state.PickerValueHolder.map（（项，键）=>
)}
}
);
}
}
const styles=StyleSheet.create({
容器：{
弹性：1，
为内容辩护：“中心”，
背景颜色：“#ecf0f1”，
填充：8，
}
});

---

谢谢

您的目标是在ValueChange上呈现5个文本输入

在你的州有一个布尔值

state = {
    PickerValueHolder: [],
    selectedValue: '',
    isChange : false,
  }

在onChange函数中，通过设置布尔值应用任何条件来呈现这些项：

onPickerValueChange=(itemValue, itemPosition)=>{
      this.setState({isChange:true});
    }

使一个功能显示项目呈现5个输入

const displayItems =  () => {
 if (this.state.isChange) {
  return  for (let i=0; i<5; i++) {
     return (
           <View key={<TextInput></TextInput>}>
              <TextInput style={{ textAlign: 'center', marginTop: 5 }} 
              placeholder="Enter your name ">
              </TextInput>
              </View>
      );
    }
 }
};

constdisplayitems=（）=>{
if（this.state.isChange）{
返回（设i=0；i
)}
);

Try

i

Hi-Dan，请帮忙错误是什么？

return (
      <View style={styles.container}>
        {displayItems()}
        <Picker
                selectedValue={this.state.selectedValue}
               onValueChange={this.onPickerValueChange}>
                { this.state.PickerValueHolder.map((item, key)=>
                  <Picker.Item label={item.name} value={item.name} key={key} />
                )}
              </Picker>
      </View>
);