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道具是不是工作正常

回答

相關問題