React this.props.children.apply 不是函数

Question

我正在制作一个未声明的 React 应用程序来管理我的应用程序的状态，该应用程序是一个简单的注释 CRUD。

我有一个 NoteList 组件来呈现笔记列表。这是我在 NoteList 组件中的 render() 函数：

render() {
        return (
            <Subscribe to={[NoteContainer]}>
                {noteContainer => (
                    noteContainer.state.isLoaded ?
                        (
                            noteContainer.state.notas.map((note, i) => {
                                return (<Note note={note} index={i} onRemoveNote={this.removeNote} onEditNote={this.saveEditNote} key={i}></Note>)
                            })
                        )
                        :
                        (
                            <div>Loading Notes...</div>
                        )
                    )}
                )}
            </Subscribe>
        )
}

但是，当我加载页面时，出现以下错误：

this6.props.children.apply is not a function

并在 chrome 控制台中进行下一个描述：

The above error occurred in the component: in Consumer (created by Subscribe) in Subscribe (at NoteList.js:19) in NoteList (at App.js:160) in Provider (created by Consumer) in Consumer (created by Provider) in Provider (at App.js:159) in App (at src/index.js:7)

我不知道这个错误的根源是什么，如果有人能给我任何帮助，我将不胜感激！

在此先致谢，祝您有愉快的一天！

Answer 1

<Subscribe /> 的 children 是 returns 数组 children 的函数，这就是错误的原因。要检查它，在 <Subscribe /> 里面，你可以做 console.log(this.props.children) 你会看到它是一个数组，你不能在数组中使用 apply，你需要遍历并将它应用到每个 children

this.props.children.map(children => children.apply())

React this.props.children.apply 不是函数

React this.props.children.apply is not a function

javascript

reactjs

unstated