用选择器处理动态状态

时间:2020-03-28 13:54:44

标签: javascript reactjs react-native

我有一个组件,如果按下按钮,它将创建新的选择器组件

问题是选择器共享相同的状态

我希望每个组件都有自己的状态

有什么办法可以解决这个问题?

picker_mockup_screen

到目前为止我有

    constructor(props) {
        super(props);
        this.state = {
            loading: true,
            qty: undefined,
            selected2: undefined,
            garbageTypeQty: 1,
            dataKey: undefined,
            trashData: undefined,
            inputGarbage: [],
            total: undefined
        };
    }
componentDidMount() {
   estimationPrice(20)
     .then((res) => {
           this.setState({ trashData: res.data, loading: false })
      }).catch((err) => {
           console.log(err);
      })
    }
<Button small success onPress={() => this.setState({ garbageTypeQty : this.state.garbageTypeQty + 1 })}>
  <Text style={styles.buttonAdd}>Add</Text>
</Button>
    <Item picker regular style={styles.itemInputBox}>
      <Picker
       mode="dropdown"
       iosIcon={<Icon name="arrow-down" />}
       style={styles.itemPickerInput}
       selectedValue={this.state.selected2}
       onValueChange={this.onValueChange2.bind(this)}
      >

         {this.state.trashData.map((item, key) => (
           <Picker.Item label={item.type.type_name} value={item.type.type_name} key={key}  />
                ))
           }
      </Picker>

1 个答案:

答案 0 :(得分:0)

现在可以使用

我使用https://reactjs.org/docs/update.html

看起来像

  handleChange = (index, attributes) => {
    let newState = update(this.state, {
      garbageInput: {
        [index] : {
          ...attributes
        }
      }
    })
    this.setState(newState);
  }
相关问题