我如何確保React道具的類型正確

Question

我有一個處理相當大的數據集的組件，並且圍繞數組創建了一個代理包裝器，該包裝器有助於處理重復操作（例如排序）。

我想確保如果數據（ data屬性）以數組的形式傳遞到我的組件中，那么它將得到環繞它的代理。 換句話說，是這樣的：

constructor(props, ...args) {
  if (props.data && !props.data.isData) {
    props.data = new Proxy(props.data, proxyHandlers);
  }

  super(props, ...args);
}

（以及componentWillReceiveProps中類似的內容）。

這是行不通的，因為React會鎖定道具以使其不可變。 什么是實現此目標的正確的React-y方法？

Answer 1

您應該使用更高階的組件將道具轉換為所需的道具。

就像是

const props => {
  if (props.data && !props.data.isData) {
    const newData = new Proxy(props.data, proxyHandlers);
    return <MyOldComponent data={newData} />;
  }
  return null;
}