एक ईएस 6 प्रतिक्रिया घटक में PureRenderMixin

Question

क्या एक प्रतिक्रिया ES6 वर्ग घटक में मिश्रित शामिल करने का कोई तरीका है? (यानी extends React.Component)? यदि हां, तो ऐसा करने का आधिकारिक तरीका क्या है?

मैं अपने घटकों में से एक में PureRenderMixin शामिल करना चाहता हूं जिसमें भिन्न प्रक्रिया को तेज करने के लिए एक अपरिवर्तनीय स्थिति है।

Answer 1

आम तौर पर mixins के लिए दो समाधान में ES6 शैली प्रतिक्रिया वर्ग हैं:

1. एक उच्च क्रम घटक बनाएं (जैसे here)
2. उपयोग एक डेकोरेटर अगर आप ' बेबेल में प्रारंभिक चरण ES7 प्रस्तावों को सक्षम करने के लिए तैयार हैं (उदाहरण के लिए here)

मैंने वास्तव में trie नहीं किया है मैं लाइब्रेरी # 2 के लिए जुड़ा हुआ है, लेकिन सजावटी मुझे मिश्रण के लिए एक सुरुचिपूर्ण प्रतिस्थापन के रूप में हड़ताल करते हैं।

Answer 2

अभी तक, दस्तावेज़ीकरण के अनुसार नहीं।

स्रोत: http://facebook.github.io/react/docs/reusable-components.html#no-mixins

Answer 3

मैं react-mixin का उपयोग करता हूं यदि मैं अपने ईएस 6 प्रतिक्रिया घटकों में मिश्रित होना चाहता हूं, लेकिन मैंने PureRenderMixin के साथ इस लाइब्रेरी को आजमाया नहीं है।

Answer 4

https://facebook.github.io/react/docs/shallow-compare.html

shallowCompare PureRenderMixin रूप में एक ही कार्यक्षमता प्राप्त करने के लिए एक सहायक समारोह प्रतिक्रिया के साथ ES6 कक्षाओं का उपयोग करते समय है।

import shallowCompare from 'react-addons-shallow-compare'; 

export default class SampleComponent extends React.Component { 

    shouldComponentUpdate(nextProps, nextState) { 
    // pure render 
    return shallowCompare(this, nextProps, nextState); 
    } 

    render() { 
    return <div className={this.props.className}>foo</div>; 
    } 
} 

PureRenderMixin की Source code है:

var ReactComponentWithPureRenderMixin = { 
    shouldComponentUpdate: function(nextProps, nextState) { 
    return shallowCompare(this, nextProps, nextState); 
    }, 
}; 

तो, जब आप PureRenderMixin उपयोग करते हैं, आप वास्तव में उपयोग shallowCompare

अद्यतन 15.3.0:

जोड़े- विस्तार करने के लिए एक नई बेस क्लास, react-addons-pure-render-mixin को बदलकर अब मिश्रित ES2015 कक्षाओं के साथ काम नहीं करते हैं।