Đạo cụ truyền tải phản ứng ngoại trừ một số

Question

Phản hồi đề xuất cho Transfer Props. Khéo léo!

Tôi làm cách nào để chuyển tất cả trừ một?

render: function(){ 
    return (<Cpnt {...this.propsButOne}><Subcpnt one={this.props.one} /></Cpnt>); 
} 

Answer 1

Bạn có thể sử dụng kỹ thuật sau đây để tiêu thụ một số các đạo cụ và vượt qua trên còn lại:

render() { 
    var {one, ...other} = this.props; 
    return (
    <Cpnt {...other}> 
     <Subcpnt one={one} /> 
    </Cpnt> 
); 
} 

Source

Answer 2

Điều bạn cần làm là tạo bản sao đối tượng đạo cụ và xóa (các) khóa bạn không muốn. Cách dễ nhất là sử dụng omit từ lodash nhưng bạn cũng có thể viết một đoạn mã cho điều này (tạo một đối tượng mới có tất cả các phím của đạo cụ ngoại trừ một phím).

Với omit (một vài lựa chọn ở phía trên, tùy thuộc vào những gì gói bạn nhập/ES hương vị bạn sử dụng):

const omit = require('lodash.omit'); 
//const omit = require('lodash/omit'); 
//import { omit } from 'lodash'; 

... 
render() { 
    const newProps = omit(this.props, 'one'); 
    return <Cpnt {...newProps}><Subcpnt one={this.props.one} /></Cpnt>; 
} 

Answer 3

Nếu bạn có rất nhiều đạo cụ bạn không muốn trong ...rest ví dụ defaultProps, nó có thể gây phiền nhiễu để viết tất cả chúng hai lần. Thay vào đó, bạn có thể tự tạo bản thân bằng một vòng lặp đơn giản trên các đạo cụ hiện tại như:

let rest = {}; 
Object.keys(this.props).forEach((key, index) => { 
    if(!(key in MyComponent.defaultProps)) 
     rest[key] = this.props[key]; 
});