2017-04-20 28 views
0

どういう意味...小道具?コードは次のとおりです。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それが実際の要素の子であると仮定し、しかし?

ありがとうございます。この文脈で使用

+2

の可能性のある重複[における3つのドットがそう反応しない何に?](http://stackoverflow.com/questions/31048953/what-does-the-three-dots-in-react-do) –

+0

'const {children、... props} = this.props;'は、props.childrenを子に割り当て、this.propsのすべての残りの値をpropsに割り当てます。 – elmeister

答えて

1

...「彼らの残りの部分」のように、"the rest" parameterと呼ばれる

このライン、オブジェクトからthis.props新しい変数routerindextochildrenを割り当てるために、オブジェクトDestructuring assignment構文を使用していますそしてthis.propsで他のすべて(それらの残りの部分)ここで

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

propsには、それの使用方法の別の例である:

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

ありがとうございました!それは大きな助けです。 – JuMoGar