解构对象并忽略其中一个结果

时间:2016-06-15 14:48:59

标签: javascript reactjs destructuring ecmascript-next

我有:

const section = cloneElement(this.props.children, {
  className: this.props.styles.section,
  ...this.props,
});

this.props内,我有一个styles属性,我不想传递给克隆元素。

我该怎么办?

4 个答案:

答案 0 :(得分:19)

您可以使用object rest/spread syntax

// We destructure our "this.props" creating a 'styles' variable and
// using the object rest syntax we put the rest of the properties available
// from "this.props" into a variable called 'otherProps' 
const { styles, ...otherProps } = this.props;
const section = cloneElement(this.props.children, {
  className: styles.section,
  // We spread our props, which excludes the 'styles'
  ...otherProps,
});

我假设您已经基于上面的代码获得了此语法的支持,但请注意,这是一种建议的语法,可通过babel stage 1 preset向您提供。如果执行时出现语法错误,可以按如下方式安装预设:

 npm install babel-preset-stage-1 --save-dev

然后将其添加到您的babel配置的预设部分。例如,在.babelrc文件中:

 "presets": [ "es2015", "react", "stage-1" ]

根据OP的问题评论进行更新。

好的,你说你已经在这个块之前声明了一个styles变量?我们也可以管理这个案子。您可以重命名您的结构化参数以避免这种情况。

例如:

const styles = { foo: 'bar' };

const { styles: otherStyles, ...otherProps } = this.props;
const section = cloneElement(this.props.children, {
  className: otherStyles.section,
  // We spread our props, which excludes the 'styles'
  ...otherProps,
});

答案 1 :(得分:5)

您可以使用Object Rest Spread operator魔法。

//create the reader
var reader = ExcelReaderFactory.CreateReader(stream);
var result = reader.AsDataSet();

DataRowCollection dt = result.Tables[0].Rows;
//ignore the first 3 rows
for(int dataRowCount = 3; dataRowCount < dt.Count; dataRowCount++)
{
    //exclude the column 1 and 2 and any columns after 9
    for (int columnNumber = 2; columnNumber < 8; columnNumber++)
    {
        Debug.Log(dr[dataRowCount][columnNumber].ToString());
        msg += dr[dataRowCount][columnNumber].ToString();
    }
} 

因此,您的情况应该是:

const props = { a: 1, b: 2, c: 3 };
const { a, ...propsNoA } = props;
console.log(propsNoA); // => { b: 2, c: 3 }

答案 2 :(得分:0)

我喜欢ctrlplusb的答案,但如果您不想添加新的babel预设,可以使用Object.assign替代方案:

const section = cloneElement(this.props.children, {
    className: this.props.styles.section,
    ...Object.assign({}, this.props, {
        styles: undefined
    })
});

答案 3 :(得分:0)

或者你可以做这样的事情......

var newProp = (this.props = {p1, p2,...list out all props except styles});