在组件内部使用 redux state 的最佳实践是什么？

Question

假设我有一个大存储对象，每个组件只需要它的一小部分。管理每个组件内部状态的最佳实践是什么？

我考虑过的两种方法是将内部组件状态设置为我在 componentDidMount() 中需要的状态切片，或者为 render() 中的切片分配一个常量。每个的 benefit/drawback 是什么？它们都会在发生更改时更新，并且我所有的 changeHandlers 都会调用存储上的操作，而不是直接修改组件状态。非常具体地说，我正在使用 mapStateToProps 并且只需要将切片分配给某个内部变量，因为访问切片需要一个 object.map，而且我只想对每个组件执行一次，而不是每个组件我需要访问状态的时间（如果我每次都可以 this.props.storeName.someProp.value，我会）

设置为内部状态

class LoginPrimaryCell extends Component {
  state = {
    data: this.props.storeFeatures.data.find(element => element.feature === 'login').settings
  }

 componentDidMount() {
     this.setState({ data: {...this.props.storeFeatures.data.find(element => element.feature === 'login').settings}})
  }

 handleChange = (event, name) => {
    this.props.editFeature({feature: 'login', setting:'checkbox', value: event.target.checked}) //editFeature is an action on store
  }

render() {
...rest of component...

分配给常量

class LoginPrimaryCell extends Component {

 handleChange = (event, name) => {
    this.props.editFeature({feature: 'login', setting:'checkbox', value: event.target.checked}) //editFeature is an action on store
  }

render() {
 const data = {...this.props.storeFeatures.data.find(element => element.feature === 'login').settings}
}

我要寻找的是针对这种情况的最佳实践，以及每种方法的 benefits/downsides 是什么。或者，如果几乎没有区别，那完全是个人喜好。谢谢！

Answer 1

理想情况下，filter/find 元素的最佳位置是在 mapStateToProps 中使用 memoized 选择器，而不是将整个数据传递给组件并在其中进行过滤，除非您想根据条件进行过滤这是在反应组件的状态下设置的。

但是，如果您想在组件内进行过滤，则需要使用记忆函数在渲染方法中完成，因为如果在连续渲染中传递相同的参数，它将避免计算，并且会不需要在任何其他位置处理道具或过滤器更改。

将过滤数据设置为状态不是一个非常正确的解决方案，因为您不会经常更新此状态，而且，当您的 storeFeatures 道具或过滤条件发生变化时，您需要更新此状态, 这有点麻烦

在组件内部使用 redux state 的最佳实践是什么？

What is the best-practice for using redux state inside components?

standards

state

reactjs

redux

react-redux