javascript - react 无状态组件不工作

Question

这是我的代码:

import React, { Component } from 'react'
import { BackButton } from 'components/button'

class LandingHeader extends Component {

    render() {

        const back = (props) => <BackButton forcedBackUrl={props.back.forcedBackUrl} />

        return (
             <div>
                 {back}
                 {this.props.children}
             </div>
         )
    }

}

export default LandingHeader

如果我把 <BackButton>组件直接工作，但如果我使用无状态组件并将它返回到这个组件中，它就不会工作。我缺少什么？

我正在关注官方文档 ( https://facebook.github.io/react/docs/reusable-components.html )，但我看不出有什么问题。谢谢。

Answer 1

查看您提供的 facebook 文档，他们给出了以下示例:

const HelloMessage = (props) => <div>Hello {props.name}</div>;
ReactDOM.render(<HelloMessage name="Sebastian" />, mountNode);

不只是返回 {HelloMessage}

因此替换

{返回}

与

<Back />

你应该可以开始了