我想要javascript三点运算符的意思

前端之家收集整理的这篇文章主要介绍了我想要javascript三点运算符的意思前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我看到rubix代码

http://wrapbootstrap.com/preview/WB09498FH(网站点击演示点击)@H_403_3@

它是反应组件中的代码@H_403_3@

JavaScript的@H_403_3@

//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下一行代码@H_403_3@

… this.props@H_403_3@

和@H_403_3@

返回下一行代码@H_403_3@

一个{…道具}@H_403_3@

这是什么 ”…” ?@H_403_3@

@R_403_323@

正如@zerkms在 comments中提到的那样;它是 ECMAScript 2016 (ES7) Proposal中的对象静止/传播属性运算符,也在 React docs中提到过.

你看到的代码@H_403_3@

var props = {
  href: '/app/mailBox/mail',className: classes
};

得到以下评估,其中props对象属性被扩展到新的props对象:@H_403_3@

var props = {
  href: '/app/mailBox/mail',src: 'https://example.com',name: 'myName',labelClass: 'myLabelClass',labelValue: 'mylabelValue',className: classes
};
原文链接:https://www.f2er.com/js/158174.html

猜你在找的JavaScript相关文章