Reactjs Redux存储：如何订阅组件中的实际更改

我的几个组件应该只呈现一次，因为那时我只希望它们侦听全局存储中的更改并相应地执行操作。但是我做不到：store.subscribe和redux watch我只在数据被发送时才尝试启动，而不是在存储实际更改时启动。这意味着相应的函数不能使用this.props.bla，因为它还没有更新。是否有某种解决方案可以让您知道，在渲染函数中不使用bla的情况下，这个.props.bla何时实际更改了

组件的示例：

import React, { Component } from 'react';
import { connect } from 'react-redux';

const mapStateToProps = state => {
    return { 
         position: state.position //<== when to know for sure it changed?
    };
};

class MyComp extends Component {
    constructor(props) {
        super(props);    
        this.state = {
            number: 0
        };
        store.subscribe(() => {
            const currentState = store.getState();
            // even if I have the updated value here in currentState, there are not guarantees this.props.position already changed.
        });
    }
    calculate = ()=>{
       // Do some calculation with this.props.position and change the number.
    }
    render(){
       return <div>{this.state.number}</div>;
   }
}

export default connect(mapStateToProps)(MyComp);

import React，{Component}来自'React'；
从'react redux'导入{connect}；
常量mapStateToProps=状态=>{
返回{
位置：state.position//{
const currentState=store.getState（）；
//即使我在currentState中有更新的值，也不能保证this.props.position已经更改。
});
}
计算=（）=>{
//使用此.props.position进行一些计算并更改数字。
}
render（）{
返回{this.state.number}；
}
}
导出默认连接（mapstatetops）（MyComp）；

当您想要“响应”特定的道具值更新时，您应该实施

componentdiddupdate

生命周期方法。在您的情况下，如果需要知道注入的

位置

道具值何时更新，请添加一个条件，将以前的

位置

道具值与当前的

位置

道具值进行比较

componentDidUpdate(prevProps) {
  if (prevProps.position !== this.props.position) {
    // position value updated!
  }
}

当您想要“响应”特定的道具值更新时，您应该实现

componentdiddupdate

lifecycle方法。在您的情况下，如果需要知道注入的

位置

道具值何时更新，请添加一个条件，将以前的

位置

道具值与当前的

位置

道具值进行比较

componentDidUpdate(prevProps) {
  if (prevProps.position !== this.props.position) {
    // position value updated!
  }
}

---

您可以通过订阅应用商店来订阅redux应用商店中的更改。不要使用

store。直接订阅
。使用HOC或react钩子连接到侦听器以获取特定的更改。抱歉，但是Redux在。。。。我只是换了个姿势来回应这个问题，我很喜欢。我可以直接转到显示4条数据库记录的页面，转到我的数据库工具并删除一条记录，然后当我再次单击浏览器窗口时，它就会更新。您还可以取消任何现有的查询，强制React Query再次重新提取数据。@DrewRese我已经在使用connect，但如果不在渲染函数中放置道具，我不知道如何侦听更改。你能举一个这样一个组件的例子吗（也许你会创造一个答案？）谢谢@TonyDrummond谢谢你的建议！我也会考虑用别的东西。Reac查询是否允许您拥有像redux store这样的中央存储。我需要多个组件来使用一些全局源。@mimic-我今天刚刚为其他人制作了这个视频，简要介绍了它。我是一名较新的开发人员（在MERN stack有3个月的经验），能够转换我的整个应用程序，同时消除了1500行Redux操作、常量、减缩器和其他B。现在，您可以通过订阅redux应用商店来订阅该应用商店中的更改。不要使用
store。直接订阅
。使用HOC或react钩子连接到侦听器以获取特定的更改。抱歉，但是Redux在。。。。我只是换了个姿势来回应这个问题，我很喜欢。我可以直接转到显示4条数据库记录的页面，转到我的数据库工具并删除一条记录，然后当我再次单击浏览器窗口时，它就会更新。您还可以取消任何现有的查询，强制React Query再次重新提取数据。@DrewRese我已经在使用connect，但如果不在渲染函数中放置道具，我不知道如何侦听更改。你能举一个这样一个组件的例子吗（也许你会创造一个答案？）谢谢@TonyDrummond谢谢你的建议！我也会考虑用别的东西。Reac查询是否允许您拥有像redux store这样的中央存储。我需要多个组件来使用一些全局源。@mimic-我今天刚刚为其他人制作了这个视频，简要介绍了它。我是一名较新的开发人员（在MERN stack有3个月的经验），能够转换我的整个应用程序，同时消除了1500行Redux操作、常量、减缩器和其他B。我还有一个问题——由于某种原因，当redux存储值更改时，会调用我的render（），但不会调用componentDidUpdate（），我不知道为什么。有什么想法吗？谢谢@模拟我真的无法想象在更新DOM时可以调用
render
，而不调用
componentdiddupdate
的场景。请随便问一个关于SO的新问题，并在这里给我一个链接，我有时间可以看一看。至少它会更明显，你可以更快地看到它。谢谢，德鲁！事实上，我发现我挂载组件而不是刷新它哈哈-这就是为什么它没有被调用，但componentDidMount（）是：）我还有另一个问题-出于某种原因，当redux存储值更改时，我的render（）被调用，但不是componentDidUpdate（），我不知道为什么。有什么想法吗？谢谢@模拟我真的无法想象在更新DOM时可以调用
render
，而不调用
componentdiddupdate
的场景。请随便问一个关于SO的新问题，并在这里给我一个链接，我有时间可以看一看。至少它会更明显，你可以更快地看到它。谢谢，德鲁！事实上，我发现我挂载了组件，而不是刷新它哈哈-这就是为什么它没有被调用，但componentDidMount（）是：）