ReactJS中的'...道具'是什麼意思？

道具是什麼意思？代碼：ReactJS中的'...道具'是什麼意思？

export default class NavItem extends React.Component { 
constructor() { 
    super(); 
} 

render() { 
    const { router, index, to, children, ...props } = this.props; 
    let isActive = false; 

    if (router.isActive('./', true) && index) { 
     isActive = true

children我想這是實際元素的孩子，但...props這是什麼意思？

謝謝。

在該上下文中使用

來源

2017-04-20 JuMoGar

的可能的複製[什麼的三個點中反應過來怎麼辦？（http://stackoverflow.com/questions/31048953/what-does-the-three-dots-in-react-do） –

'const {children，... props} = this.props;'意思是將props.children分配給兒童，將this.props的所有剩餘值分配給道具。 – elmeister

...稱爲"the rest" parameter，如在「他們的休息」

這條線是使用對象Destructuring assignment語法從所述對象this.props新變量router，index，to和children分配，和其他一切（他們的休息）在this.props到props

const { router, index, to, children, ...props } = this.props;

這裏是它的另一個例子是使用：

const bigBird = {height: 'tall', color: 'yellow', disposition: 'sunny'}; 
const {height, ...others} = bigBird; 
//height == 'tall' 
//others == {color: 'yellow', disposition: 'sunny'};

來源

2017-04-20 05:54:38

謝謝！這是一個很大的幫助。 – JuMoGar

ReactJS中的'...道具'是什麼意思？

回答

相關問題