Redux connect 將不必要的道具“調度”傳遞給連接的組件

Question

我正在使用 redux connect 將商店連接到 Image 組件。 我只希望在那里（在 Image 組件中）從 Redux 中檢索一個道具：“images”。 但我也得到了一個額外的道具：“調度”。

import { connect } from "react-redux";
import Image from "./Image";
import { imagesSelector } from "units/images/selectors";

const mapStateToProps: MapStateToPropsParam = (state) => ({
  images: imagesSelector(state),
});

export default connect(mapStateToProps)(Image);

在 Image 組件中，我得到： { images: [...], dispatch: function(){...}}

問題：如何從傳遞給我的組件中排除調度？

Answer 1

來自 react-redux 文檔：

如果你沒有為connect()指定第二個參數，你的組件將默認接收dispatch作為 prop。

如果您不想要這種行為，您可以改為將第二個參數傳遞給connect函數，這將是mapDispatchToProps參數。

它可以是一個函數，也可以是一個對象。

我們建議始終使用 mapDispatchToProps 的“對象簡寫”形式，除非您有特定的理由來自定義調度行為。

注意：

• mapDispatchToProps 對象的每個字段都被假定為一個動作創建者
• 您的組件將不再作為道具接收調度

文檔： https : //react-redux.js.org/using-react-redux/connect-mapdispatch

Answer 2

export default connect(mapStateToProps, null)(Image);

添加 null 作為第二個參數，你就可以開始了