javascript - Reactjs Prop 无法正常工作

Question

var Works = function welcome(props) {
  return <h1> Hello, {props.name} </h1>;
}

/*function welcome() {
  return <h1>Hello, {this.props.name}</h1>;
}*/

const element = (<div>
    <Works name="Luffy" />
</div>);

ReactDOM.render(
  element,
  document.getElementById('root')
);

如果我用没有传递 Prop 的注释部分替换 Works 组件，它会出错，我需要知道为什么在使用类时我们直接使用 this.props 时会发生这种情况。为什么不在这里？

Answer 1

你应该在Function之后定义组件的名字:

function Works(props) {
    return <h1 > Hello, { props.name } < /h1>;
}

希望对您有所帮助!