首页 > 解决方案 > 不理解使用三点符号的 Javascript 语法

问题描述

我正在为工作学习 Javascript。具体来说,我正在学习一个 React/Redux Web 应用程序,并且在整个应用程序中使用三点符号时遇到了问题。我用谷歌搜索了三点符号的含义,看起来它是扩展运算符。但据我了解,扩展运算符只能用于可迭代对象,例如数组。我没有看到可迭代的参数。下面的示例代码是应用程序使用的示例。在示例中,我们有 2 个反应组件AppInputSomeObject. SomeObject使用参数调用AppInputrender 方法,这些参数被分配给 AppInput 中的道具。但我不明白它是如何做到的。有人可以解释下面的代码中发生了什么吗?谢谢

export default class AppInput extends React.Component {
  static propTypes = {
    className: PropTypes.string,
    disabled: PropTypes.bool,
    value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.bool]),
    onChange: PropTypes.func,
    inputRef: PropTypes.func,
    type: PropTypes.string,
    highlighted: PropTypes.bool
  }
  .....
  constructor(props) {
    super(props);
    this.state = { value: sanitizeValue(props.value) };
  }
  .....
}


export class SomeObject extends React.Component<Props, State> {    
    .....
    return (
      <div className="generic-table-row">
        <div className="generic-table-cells">
          <AppInput
            {...{
              value: someVal,
              onChange: this.handleChange,
              className: 'someOtherObj',
              disabled: !pushMode
            }}
          />
        </div>
        {deleteMode && deleteMessage}
      </div>
    );
  }
}

标签: javascriptreactjsecmascript-6

解决方案


所做的...只是将它所指的对象(匿名对象)的内容传播出去——所以它会是这样value={someVal}


推荐阅读