React-native：为列表视图设置状态，但对象仍然返回未定义

Question

从下面的代码我尝试使数据源返回一个字符串，但它返回未定义

constructor(props) {
    super(props)
    this.state = {
        uuid : this.props.navigation.state.params.uuid,
        facilityData: [],
        dataSource : []
    };
}

componentDidMount() {
    facilityStore.getFacilityInfo(this.state.uuid)
        .then((res) => {
            this.setState({
                facilityData: res.data.data
            })
            {this.checkparticipants()}
        })
        .catch((error) =>{
            alert(error);
        })
};

checkparticipants(){
    var ds = new ListView.DataSource({rowHasChanged: (r1,r2) => r1!=r2});
    this.setState({
        dataSource : ds.cloneWithRows([
            {invitePlaceholder : "Participant"},
            {invitePlaceholder : "Participant"},
            {invitePlaceholder : "Participant"},
            {invitePlaceholder : "Participant"},
        ])
    })
    console.log(this.state.dataSource.invitePlaceholder)
}

我想根据列表视图的数量呈现文本输入，但有一个错误是：

类型错误：未定义不是对象

<ListView
    dataSource = {this.state.dataSource}
    renderRow={(rowData)=>
        <TextInput style={styles.input}
            placeholder={rowData.invitePlaceholder}
        />
    }
/>

那么我应该怎么做才能使对象不是从代码中未定义的呢？

Answer 1

setState是一种异步方法。 所以，为了有任何状态，我认为你需要在状态设置后执行checkParticipants 。 这是作为setState的回调完成的：

facilityStore.getFacilityInfo(this.state.uuid)
.then((res) => {
  this.setState({ facilityData: res.data.data }, this.checkparticipants)
})

Answer 2

this.checkparticipants()

未调用，因为您的语法错误。 您的 componentDidMount 生命周期应该是：

componentDidMount() {
    facilityStore.getFacilityInfo(this.state.uuid)
        .then((res) => {
            this.setState({
                facilityData: res.data.data
            },
            () => this.checkparticipants());
        })
        .catch((error) =>{
            alert(error);
        });
}

setState是一种异步方法。 完成状态设置后调用checkparticipants()