Reactjs道具是不是工作正常

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') 
);

如果我更换了与注释部分，它没有道具传递给它的工作原理组件，它提供了错误，我需要知道为什么会发生在那里，而使用类我们直接使用。道具。为什么不在这里？Reactjs道具是不是工作正常

来源

2017-07-20 Abhishek

，因为它是**无状态的功能组件**检查[** SO DOC获取更多详细信息**]（https://stackoverflow.com/documentation/reactjs/6588/stateless-functional-component s/28223 /无状态功能组件＃t = 201707201028091144259）也检查[** React DOC **]（https://facebook.github.io/react/docs/components-and-props.html#functional-和类组件） –

你应该功能后定义组件的名称：

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

希望它能帮助！

来源

2017-07-20 10:33:46 QuarK

我不想传递道具作为参数，我如何访问使用this.props，因为我们在类组件 – Abhishek

如上所述，这是一个无状态的组件和道具将是一个参数，你可以定义通过做Works.propTypes = blahblahblah proptypes，但你不能使用this.props – QuarK

因为在这里你是不是叫道具，

/*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') 
);

来源

2017-07-20 10:33:50

我知道，但在类中，因为它与this.props.name一起工作，为什么这里不工作 – Abhishek

Reactjs道具是不是工作正常

回答

相关问题