Question

在我的本机项目中，我有一个允许用户按分支过滤员工的选择器。我从我的数据库中获得了标签名称和值。现在，我可以从选择器值获得分支ID ，并且可以通过此链接 http://192.168.10.60:8888/customerfeedback/public/api/staff?pId= 按分支过滤员工。

我的问题是，我想更新州值，以向用户显示他们选择了哪个分支，而不是显示 id 。如何获取选择器标签名称并将其更新到我的状态？

这是我的代码：

    <PickerIOS
     style={{ flex: 1 }}
     selectedValue={this.state.pickerSelected}
     onValueChange={(value, index) => this.onPickerValueChange(value, index)}
    >
    {branches.map(branch =>{
      return (
         <PickerIOS.Item key={branch.id} label={branch.name} value={branch.id}/>
    );
    })}
   </PickerIOS>

现在我可以获取值和索引，但我想从我的数据库而不是数组索引获取索引。

onPickerValueChange = (value, index) => {
    this.setState(
      {
        pickerSelected: value
      },
      () => {

        console.log(value, index);

      }
    );
}

感谢您的帮助。

Answer 1

使用索引获取数组元素。

onPickerValueChange = (value, index) => {
this.setState(
  {
    pickerSelected: value
  },
  (name, index) => {

    console.log(branches[index]);

  }
 );
}

Answer 2

最后我现在可以解决问题了。我知道这不是一个好的解决方案，但至少它现在正如我想要的那样工作:)

constructor(props) {
  super(props);
  pickerSelected: '',
  defaultSelected: 'Select branch's name',
}

以及我如何更新状态

onPickerValueChange = (value) => {
    const { branches } = this.state;
    let branchName = branches.find(branch => branch.id === value);
    this.setState(
      {
        pickerSelected: value,
        defaultSelected: branchName.name
      }
    );
}

希望这可以帮助遇到同样问题的其他人：）

Answer 3

您是否尝试通过将值设为对象来做类似的事情？

看起来像这样的东西：

console.log

并通过类似的方式访问它：

    <PickerIOS
     style={{ flex: 1 }}
     selectedValue={this.state.pickerSelected}
     onValueChange={(value, index) => this.onPickerValueChange(value, index)}
    >
    {branches.map(branch =>{
      return (
         <PickerIOS.Item key={branch.id} label={branch.name} value={id: branch.id, name: branch.name}/>
    );
    })}
   </PickerIOS>

如何从React Native Picker获取值和标签名称？

3 个答案: