React Native Picker 不显示子部门详细信息

时间:2021-01-07 12:17:02

标签: react-native picker

我尝试使用 react native Picker 获取部门和子部门名称。但我只能得到 主要部门只有子部门没有得到请帮我解决这个问题

class CustomExample extends Component {
  constructor(props) {
    super(props);
    this.state = {
      SubDeptValue: null,
      departmentSource: [],
      subDepartmentSource: [],
    };
  }

  componentDidMount() {
    return fetch("http://192.168.1.191:3000/departments")
      .then((response) => response.json())
      .then((responseJson) => {
        this.setState({ departmentSource: responseJson });
      })
      .catch((err) => {
        console.log("Error" + err);
      });
  }

  getSubDept() {
    return fetch(
      "http://192.168.1.191:3000/subdepartments/" + this.state.SubDeptValue
    )
      .then((response) => response.json())
      .then((responseJson) => {
        this.setState({ subDepartmentSource: [responseJson] });
        console.log(this.state.subDepartmentSource);
      })
      .catch((err) => {
        console.log("Error" + err);
      });
  }

  render() {
    const subDept = this.state.subDepartmentSource;
    const options = this.state.departmentSource;
    return (
      <View style={{ flex: 1, flexDirection: "row", justifyContent: "center" }}>
        <CustomPicker
          options={options}
          getLabel={(item) => item.Dep_Name}
          onValueChange={(value) => {
            this.setState({ SubDeptValue: value.Dep_ID }), this.getSubDept();
          }}
        />

        <CustomPicker options={subDept} getLabel={(item) => item.SubDep_Name} />
      </View>
    );
  }
}
export default CustomExample;

0 个答案:

没有答案