反应 this.props.children.apply 不是一个函数

Question

我正在制作一个带有 unstated 的 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 不是函数

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

组件出现上述错误： 在消费者中（由订阅创建） 在订阅中（在 NoteList.js:19） 在 NoteList (在 App.js:160) 在提供者（由消费者创建） 在消费者中（由提供者创建） 在提供者中（在 App.js:159） 在应用程序中（在 src/index.js:7）

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

提前致谢，祝你有美好的一天！

Answer 1

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

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