首页 > 解决方案 > react.js 箭头函数返回注意

问题描述

class Greeting extends React.Component {
    state={
        username:'u1',
        user:['u1','u2']
    }

    constructor(props){
        super(props);
        this.uList=this.uList.bind(this);
    }

    uList = () =>{
        return this.state.user.map((u)=>{ 
            console.log(u);
            return <li>{u}</li>; 
        }); 
    }

    render() {
        return (<div>
            <p>Hello world</p>
            {this.uList}
                </div>

            );
    }
}

完整代码:https ://pastebin.com/raw/Azi65Vnu

我第一次尝试使用 cdn 的 react.js,它只给了我 hello world,但没有渲染列表。

这是为什么?

标签: javascriptreactjs

解决方案


你需要调用函数

render() {
  return (<div>
      <p>Hello world</p>
      {this.uList()}
    </div>
  );
}

推荐阅读