加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 （https://www.lidatong.com.cn/）- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置： 首页 > 百科 > 正文

react-native – null不是React Native组件中的对象(评估’inter

发布时间：2020-12-15 05:08:15 所属栏目：百科 来源：网络整理
导读：我的React Native应用程序有一个应该显示可滚动列表的组件.我也使用 React Native Elements,虽然离开它似乎并没有产生很大的不同. 我的组件看起来像这样： export class MyComponent extends React.Component { constructor(props) { super(props); const ds
我的React Native应用程序有一个应该显示可滚动列表的组件.我也使用 React Native Elements,虽然离开它似乎并没有产生很大的不同.

我的组件看起来像这样：

export class MyComponent extends React.Component {
    constructor(props) {
        super(props);

        const ds = new ListView.DataSource({ rowHasChanged: (r1,r2) => r1 !== r2 });
        this.state = { ds: ds.cloneWithRows(this.props.myItems) };
    }

    render() {
        return (
            <View>
                <Text>Some text here</Text>
                <List>
                    <ListView dataSource={ this.state.ds } renderRow={ renderRow } />
                </List>
            </View>
        );
    }
};

其中renderRow在类外声明,因为它不需要其状态,如：

const renderRow = (rowData,sectionId) => {
    return (
        <ListItem
            key={ sectionId }
            title={ rowData.myProp }
            subtitle={ rowData.myOtherProp }
        />
    );
};

此外,删除< List>与其子女似乎也没有什么区别.

从日志记录(代码中未包含,为简洁起见),我可以看到组件构造函数运行没有问题.但是,不会调用render方法.在adb logcat输出中(我正在使用Android模拟器),我看到以下内容：

10-16 14:02:34.507 10161 10205 W ReactNativeJS: Possible Unhandled Promise Rejection (id: 0):
10-16 14:02:34.507 10161 10205 W ReactNativeJS: null is not an object (evaluating 'internalInstance.getHostNode')
10-16 14:02:34.507 10161 10205 W ReactNativeJS: getHostNode@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:16594:24
10-16 14:02:34.507 10161 10205 W ReactNativeJS: getHostNode@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18320:35
10-16 14:02:34.507 10161 10205 W ReactNativeJS: getHostNode@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:16594:36
10-16 14:02:34.507 10161 10205 W ReactNativeJS: getHostNode@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18320:35
10-16 14:02:34.507 10161 10205 W ReactNativeJS: getHostNode@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:16594:36
10-16 14:02:34.507 10161 10205 W ReactNativeJS: getHostNode@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18320:35
10-16 14:02:34.507 10161 10205 W ReactNativeJS: getHostNode@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:16594:36
10-16 14:02:34.507 10161 10205 W ReactNativeJS: getHostNode@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18320:35
10-16 14:02:34.507 10161 10205 W ReactNativeJS: getHostNode@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:16594:36
10-16 14:02:34.507 10161 10205 W ReactNativeJS: updateChildren@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:17792:47
10-16 14:02:34.507 10161 10205 W ReactNativeJS: _reconcilerUpdateChildren@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:17341:36
10-16 14:02:34.507 10161 10205 W ReactNativeJS: _updateChildren@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:17445:48
10-16 14:02:34.507 10161 10205 W ReactNativeJS: updateChildren@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:17432:21
10-16 14:02:34.507 10161 10205 W ReactNativeJS: receiveComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:14715:20
10-16 14:02:34.507 10161 10205 W ReactNativeJS: receiveComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:16656:34
10-16 14:02:34.507 10161 10205 W ReactNativeJS: _updateRenderedComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18688:33
10-16 14:02:34.507 10161 10205 W ReactNativeJS: _performComponentUpdate@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18658:30
10-16 14:02:34.507 10161 10205 W ReactNativeJS: updateComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18579:29
10-16 14:02:34.507 10161 10205 W ReactNativeJS: receiveComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18481:21
10-16 14:02:34.507 10161 10205 W ReactNativeJS: receiveComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:16656:34
10-16 14:02:34.507 10161 10205 W ReactNativeJS: _updateRenderedComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18688:33
10-16 14:02:34.507 10161 10205 W ReactNativeJS: _performComponentUpdate@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18658:30
10-16 14:02:34.507 10161 10205 W ReactNativeJS: updateComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18579:29
10-16 14:02:34.507 10161 10205 W ReactNativeJS: receiveComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18481:21
10-16 14:02:34.507 10161 10205 W ReactNativeJS: receiveComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:16656:34
10-16 14:02:34.507 10161 10205 W ReactNativeJS: _updateRenderedComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18688:33
10-16 14:02:34.507 10161 10205 W ReactNativeJS: _performComponentUpdate@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18658:30
10-16 14:02:34.507 10161 10205 W ReactNativeJS: updateComponent@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18579:29
10-16 14:02:34.507 10161 10205 W ReactNativeJS: performUpdateIfNecessary@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:18495:21
10-16 14:02:34.507 10161 10205 W ReactNativeJS: performUpdateIfNecessary@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:16688:42
10-16 14:02:34.507 10161 10205 W ReactNativeJS: runBatchedUpdates@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:16299:41
10-16 14:02:34.507 10161 10205 W ReactNativeJS: perform@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:17035:16
10-16 14:02:34.507 10161 10205 W ReactNativeJS: perform@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false:17035:16
10-16 14:02:34.507 10161 10205 W ReactNativeJS: perform@http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&m
10-16 14:02:34.527 10161 10205 W ReactNativeJS: Warning: performUpdateIfNecessary: Unexpected batch number (current 17,pending 15)
10-16 14:02:34.800 10161 10205 W ReactNativeJS: Warning: performUpdateIfNecessary: Unexpected batch number (current 21,pending 15)
10-16 14:02:34.801 10161 10205 W ReactNativeJS: Warning: performUpdateIfNecessary: Unexpected batch number (current 22,pending 20)
10-16 14:02:34.905 10161 10205 W ReactNativeJS: Warning: performUpdateIfNecessary: Unexpected batch number (current 26,pending 15)
10-16 14:02:34.908 10161 10205 W ReactNativeJS: Warning: performUpdateIfNecessary: Unexpected batch number (current 27,pending 20)
10-16 14:02:35.191 10161 10205 W ReactNativeJS: Warning: performUpdateIfNecessary: Unexpected batch number (current 31,pending 15)
10-16 14:02:35.191 10161 10205 W ReactNativeJS: Warning: performUpdateIfNecessary: Unexpected batch number (current 32,pending 20)
10-16 14:02:35.192 10161 10205 W ReactNativeJS: Warning: performUpdateIfNecessary: Unexpected batch number (current 33,pending 30)

我正在使用

>反应15.3.2
> react-native 0.35.0
> react-native-elements 0.6.2

我的问题是双重的：我怎样才能解决正在发生的事情(例如为什么我的render()方法没有被调用)以及我在这里做错了什么？

原来,实际的解决方案不是使用ListView或List. render()中的一些日志记录语句导致render()方法失败 – 静默.然后RN尝试重新呈现组件,这导致问题中显示的日志消息不断重新出现,直到应用程序被杀死.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
    相关内容
      推荐文章
        站长推荐
        热点阅读

          【免责声明】本站内容转载自互联网，其发布内容言论不代表本站观点，如果其链接、内容的侵犯您的权益，烦请提交相关链接至邮箱bqsm@foxmail.com我们将及时予以处理。

          建议您使用1920×1080分辨率、谷歌浏览器Google Chrome、Microsoft Edge以获得本站的最佳浏览效果

          Copygight © 2008-2022 https://www.lidatong.com.cn/ All Rights Reserved. 李大同