每当我尝试改变状态时,我都会收到上述错误 . 我想做什么:

  • 显示初始屏幕

  • 了解相关数据

  • 将此数据委托给负责从给定源输出的子组件(mvc体系结构中的视图)

在我的构造函数中,我初始化状态就像

this.state = { items: null, mode: 'folders', modalChild: null,

    contextView: null, // if path is set in prop, trigger update

    isMounted:true,
};

componentWillUnmount() {
  this.setState({isMounted: false});
}

在将错误源跟踪到之前在以下生命周期钩子中的setState调用之后,我将其拉出到两个抽象中,如下所示:

componentDidMount() {

    DB.Folders.get_all(({rows, totalrows}) => {

        if(!this.props.deepLink) this.showFolders(rows, totalrows);

        else this.burrow();
    });
}

这是我不认为是同谋的 render 方法

render() {
    var afterMount = [
        this.state.contextView,

        this.props.navigation.state.params.headerText]
    .every(e => e !== null && e !== void(0)), modal = this.state.modalChild;


    if (afterMount) {
       return <FolderComp

            formattedComponents={this.state.contextView}

            modalChild={modal}

            headerTitle=<Text key='ht'>{this.props.navigation.state.params.headerText}</Text>
        />;
    }

    else return <View key='ct'></View>;/*loading animation here */
}

我添加了 isMounted 涂层,因为我从另一个答案中看到它有助于解决问题 .

showFolders (rows, totalrows) {

    if (this.state.isMounted) {

        if (!totalrows) {
            console.log(this.setState);

            this.setState({ items: [], contextView: <Text key='ct'>no folders to show</Text>}); // I OMIT THIS AND THE TEMPEST CEASES
        }

        else {

            this.setState({ items: rows, contextView: rows.map((obj,ind) =>
                    <Icon
                        title={obj.folderName}

                        name='md-folder'

                        style={styles.folders}

                        onPress={this.setState({mode: 'verses', context: ind})}
                    />
                )
            });
        }
    }
}

我在 FolderComp 有一个console.log . 输出顺序如下:

  • <View key='ct'></View> 并触发 componentDidMount

  • console.log(this.setState);

  • FolderComp 内的日志

  • 两个不同的错误实例,包含消息"TypeError: Cannot read property 'null' of null"

我认为错误是我传递给setState的每个键,但它们不是 . 我通过3三,得到了相同的结果 .

什么可以负责这两个空检查?什么是空对象React Native试图从中获取null属性?有没有办法在setState异步完成时将渲染入队?我尝试使用async / await修饰符返回 this.setState({ items: [], contextView: <Text key='ct'>no folders to show</Text>}, () => this.render()); ,但似乎我不能逃脱

async componentDidMount() {

    DB.Folders.get_all(({rows, totalrows}) => {

        if(!this.props.deepLink) await this.showFolders(rows, totalrows);
        ....

堆栈跟踪起泡

TheCurrentComponent (at SceneView.js:9)
in SceneView (at StackViewLayout.js:774)
in RCTView (at View.js:45)
in AnimatedComponent (at StackViewCard.js:69)
in RCTView (at View.js:45)
in AnimatedComponent (at screens.native.js:58)
in Screen (at StackViewCard.js:57)
in Card (at createPointerEventsContainer.js:27)
in Container (at StackViewLayout.js:831)
in RCTView (at View.js:45)
in ScreenContainer (at StackViewLayout.js:300)
in RCTView (at View.js:45)
in AnimatedComponent (at StackViewLayout.js:298)
in Handler (at StackViewLayout.js:279)
in StackViewLayout (at withOrientation.js:30)
in withOrientation (at StackView.js:96)
in RCTView (at View.js:45)
in Transitioner (at StackView.js:22)
in StackView (at createNavigator.js:62)
in Navigator (at createKeyboardAwareNavigator.js:12)
in KeyboardAwareNavigator (at createAppContainer.js:388)
in NavigationContainer (at renderApplication.js:34)
in RCTView (at View.js:45)
in RCTView (at View.js:45)
in AppContainer (at renderApplication.js:33)

非常感谢 .