react 无状态组件传递参数

Question

父组件：this.state = {    items: ['beijing', 'shanghai']}<div>    <List items={this.state.items}</div>const List = (items) => (<div>    <ul>        {items.map(item => <li key={item}>{item}</li>}    </ul></div>)会报错items.map is not function,这是什么原因？class List extends Component {render() {    return (        <div>            <ul>                {this.props.items.map(item => <li key={item}>{item}</li>)}            </ul>        </div>    )}}这样写就不会报错

Answer 1

使用函数参数结构

const List = ({items}) => (

<div>

    <ul>

        {items.map(item => <li key={item}>{item}</li>}

    </ul>

</div>

)