Question

每当尝试更改状态时，我都会收到上述错误。我正在尝试做的事情：

显示初始屏幕
了解相关数据
将此数据委托给负责从给定源输出的子组件（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涂层，因为从另一个答案中看到，它可能是在异步访问DB的过程中卸下了组件。不用说，这无济于事。

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：无法读取null的属性'null'”

我以为错误是我传递给setState的每个键的错误，但它们没有出现。我通过了三三，结果相同。

那两个空检查可能是什么原因？ React Native试图从中获取null属性的空对象是什么？是否只有在setState异步完成时才可以使渲染入队？我试着回来 this.setState({ items: [], contextView: <Text key='ct'>no folders to show</Text>}, () => this.render());和async / await修饰符，但看来我无法摆脱

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)

非常感谢。

TypeError：无法读取null的属性“ null”

0 个答案: