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')
);
如果我将Works组件替换为没有传递道具的注释部分,则会出错,我需要知道为什么它会在使用类时发生,我们直接使用this.props。为什么不在这里?
答案 0 :(得分:1)
您应该在Function:
之后定义组件的名称function Works(props) {
return <h1 > Hello, { props.name } < /h1>;
}
希望它有所帮助!
答案 1 :(得分:1)
因为在这里你没有叫道具,
/*function welcome() {
return <h1>Hello, {this.props.name}</h1>;
}*/
代码应该是这样的
function Welcome(props) {
return <h1>Hello, {props.name}</h1>;
}
这里的完整代码
function Welcome(props) {
return <h1>Hello, {props.name}</h1>;
}
const element = <Welcome name="Luffy" />;
ReactDOM.render(
element,
document.getElementById('root')
);