Javascript React Native:ListView在设置数据源之前呈现

Listview在设置数据源（ComponentDidMount）之前尝试渲染 所以它总是空的。如果我尝试调用loadData（），它将显示它

如何在加载完成之前避免组件渲染

行动：

export const GET_COURSES='GET_COURSES'；
export const GET_COURSES_FAILED='GET_COURSES_FAILED'；
从“../common/Functions”导入getCoursesAPI；
导出常量getCourses=（用户）=>{
返回调度=>{
getCoursesAPI（用户）
。然后（（数据）=>{
const{courseList，讲师列表}=数据；
返回调度（课程成功（课程列表、讲师列表））；
})
.catch（（）=>{
退货派送（coursesFailed（））；
});
};
}
常量课程成功=（课程、讲座）=>{
返回{
类型：获取课程，
有效载荷：{
课程，
讲座
}
}
};
常量课程失败=（）=>{
返回{
类型：获取课程失败
}
};

您可以使用

组件willmount

-hook代替

组件didmount

使用第一个，在渲染之前设置它。后者在第一次渲染组件后激发

---

编辑：由于您正在使用redux更新全局状态，然后将数据传递到道具中，因此您需要在安装组件时获取课程。通过将数据加载到

componentDidMount

-hook中，就可以实现这一点。
但是，您不需要

async

关键字，因为redux将通过组件的道具传递课程

当你的组件的道具更新后，它也会重新播放。如果希望数据源处于您的状态，可以使用

组件willreceiveprops

-hook。当组件接收到新属性时，将触发此挂钩。
调用此函数时，可以将填充的数据源添加到状态。此不会导致新渲染

例如：

class Courses extends Component {
    /* ... */

    componentDidMount() {

        // Will fetch your data asynchronously
        this.props.getCourses(this.props.users);

    }

    // This hook gets the new props passed. Old props are
    // still available in this.props
    componentWillReceiveProps(newProps) {

        const courses = newProps.courses.courses[this.props.user]
        this.setState({
            dataSource: this.state.dataSource.cloneWithRows(courses),
            dataLoaded: courses.length
        })

    }

    /* ... */
}

---

不幸的是，这没有帮助。@Ataomega我忽略了加载数据是异步的这一事实。您确定您实际上正在从

getCourses

获取数据吗？此外，您还可以让该函数返回课程，而不是事后从道具获取课程，因为您使用的是

async

。是的，它返回数据。但我需要从道具上获取数据。是redux。并将数据源设置为listview@Ataomega我根据您正在使用Redux的事实编辑了我的答案。让我知道这是否有帮助，或者你是否仍然遇到问题。您可能希望从问题中删除一些膨胀代码，并添加一些数据加载代码（如操作和减速机）。我已更新了问题。不幸的是，你所说的也没有帮助。