0

アプリで:

<FramesCollection>
      <Frames1 speed='1.0' width='auto' zIndex='1' />
      <Frames2 speed='1.2' width='auto' zIndex='1' />
      <Frames3 speed='1.4' width='auto' zIndex='1' />
      <Frames4 speed='1.6' width='auto' zIndex='1' />
      <Frames5 speed='2.0' width='auto' zIndex='4' />
      <Frames6 speed='2.5' width='auto' zIndex='3' />
      <Rails />
</FramesCollection>

FramesCollection:

    render() {
        const { selectedItem, menuItems } = this.props.bottomMenu
        const col = menuItems.length
        const springSettings = { stiffness: 170, damping: 26 };

        return (
            <aside className='frames-collection' ref='framesCollection'>

                {React.Children.map(
                    this.props.children,
                    (child, i) => {
                        if ('speed' in child.props) {

                            const width = Math.round(child.props.speed * col * 2000)
                            const style = { width: width, translateX: spring(-width * selectedItem, springSettings) }

                            return <Motion key={i} style={style}>
                                {child}
                            </Motion>

                        } else {
                            return child;
                        }
                    })
                }

            </aside>
        )
    }

コードはエラーなしでコンパイルされますが、ブラウザーを追加すると、2 つのエラーが表示されます。

警告: 失敗したプロップ タイプ:に 指定されたchildrenタイプのプロップが無効であると予想されます。in Motion (FramesCollection で作成) in FramesCollection (Connect(FramesCollection) で作成) in Connect(FramesCollection) (App で作成) in div (App で作成) in App (Connect(App) で作成) in Connect(App) inプロバイダーの divobjectMotionfunction

キャッチされていない TypeError: this.props.children は、Object.render (Motion.js:235) の関数ではありません。 ReactCompositeComponentWrapper._renderValidatedComponent (ReactCompositeComponent.js:822) で ReactCompositeComponentWrapper.performInitialMount (ReactCompositeComponent.js:362) で ReactCompositeComponentWrapper.mountComponent (ReactCompositeComponent.js:258) で Object.mountComponent (ReactReconciler.js:46) で ReactDOMComponent.mountChildren (ReactMultiChild. js:238) ReactDOMComponent._createInitialChildren (ReactDOMComponent.js:697) で

私は何を間違っていますか?

4

1 に答える 1