私はルビックスコードを参照してくださいオペレータ

Question

javascriptの三点で意味たい

http://wrapbootstrap.com/preview/WB09498FH（右デモクリックアップサイト）コンポーネント

javascript

//react ES6 
var InboxItem = React.createClass({ 
    mixins: [State, Navigation], 
    statics: { 
    ID: 0, 
    resetID: function() { 
     InboxItem.ID = 0; 
    }, 
    getID: function() { 
     return ++InboxItem.ID; 
    } 
    }, 
    handleClick: function(e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    this.transitionTo('/app/mailbox/mail'); 
    }, 
    render: function() { 
    var classes = classNames({ 
     'inbox-item': true, 
     'unread': this.props.unread 
    }); 

    var props = { 
     href: '/app/mailbox/mail', 
     onClick: this.handleClick, 
     ...this.props, 
     className: classes 
    }; 

    return (
     <a {...props}> 
     <div className='inbox-avatar'> 
      <img src={this.props.src} width='40' height='40' className={this.props.imgClass + ' hidden-xs'} /> 
      <div className='inbox-avatar-name'> 
      <div className='fg-darkgrayishblue75'>{this.props.name}</div> 
      <div><small><Badge className={this.props.labelClass} style={{marginRight: 5, display: this.props.labelValue ? 'inline':'none'}}>{this.props.labelValue}</Badge><span>{this.props.description}</span></small></div> 
      </div> 
      <div className='inbox-date hidden-sm hidden-xs fg-darkgray40 text-right'> 
      <div style={{position: 'relative', top: 5}}>{this.props.date}</div> 
      <div style={{position: 'relative', top: -5}}><small>#{InboxItem.getID()}</small></div> 
      </div> 
     </div> 
     </a> 
    ); 
    } 
}); 

のonClickに反応して

それはコードがあります次の行コード

... this

と

戻り、次の行のコード

{...}小道具

この "..." が何であるの.props？

Answer 1

@commentsに記載されているように@zerkms; React docsにも記載されているオブジェクトレスト/スプレッドプロパティ演算子はECMAScript 2016 (ES7) Proposalです。

あなたはpropsオブジェクトのプロパティが新しい小道具に延長します以下に評価さ

var props = { 
    href: '/app/mailbox/mail', 
    onClick: this.handleClick, 

    ...this.props, 

    className: classes 
}; 

取得を参照してくださいコードは、オブジェクト：

var props = { 
    href: '/app/mailbox/mail', 
    onClick: this.handleClick, 

    src: 'https://example.com', 
    name: 'myName', 
    labelClass: 'myLabelClass', 
    labelValue: 'mylabelValue', 

    className: classes 
};