React class instance propはPureComponentを使用できないようにします

Question

My Reactコンポーネントには、reduxストアからのデータに基づくクラスインスタンスである小道具があります。

この理由は、このデータをクラスとすべてのカスタムメソッド（50以上）を使用して処理する方がはるかに便利であるためです。

PureComponentをReactとして使用することはできません。常にこの小道具が変更されたものとみなします。問題は、私のReactコンポーネントの大部分がこの小道具に接続されていることです...

私は再選択のような解決策に気付いていますが、これは操作のためにセレクタがたくさんあることを意味しますこのデータの

あなたは何をお勧めしますか？このような

マイReduxの選択ルックス：

class WeatherStation { 
    constructor (data) { 
    this.station = data 
    } 

    getId() {...} 
    // many more methods 
} 

と私のリアクトCompoonent内：

getStation(state) { 
    // some logic to fetch the right station 
    return new WeatherStation(state.services.stationList[i]) 
} 

ウェザーステーションがある

class MyComponent extends React.Component { 
    ... 
    const mapStateToProps = (state, ownProps) => { 
    return { 
     station: getStation(state), 
    } 
    } 
} 

Answer 1

は、あなたがこれらの線に沿ってreselectを使用して試してみました？

import { createSelector } from 'reselect'; 

getStationData(state) { 
    // some logic to fetch the right station 

    // no new instances here, just selecting the relevant data 
    return state.services.stationList[i]; 
} 


// create "memoized" selector. 
const getEnhancedStation = createSelector(
    getStationData, 
    stationData => new WeatherStation(stationData) 
) 

私が正しくreselectとcreateSelectorを理解していれば、これが唯一の基礎となるデータ、すなわちあれば新しいウェザーインスタンスを生成する必要があります。 getStationDataから返されたものが変更されました。 （毎回新しいインスタンスを生成する代わりに、の状態でが変更されます）