Question

我正在尝试使用react-native和redux访问侦听器或帮助器类中的当前状态。

我们正在使用react-native-tcp从tcp套接字获取数据（使用nodejs网络库）。我试图以缩短代码为例，以便更好地理解。

当前情况：

套接字监听器on（'data'）在componentDidMount中注册。如https://reactjs.org/docs/react-component.html#componentdidmount中所述，“从远程端点加载数据”应该是一个很好的方法。只有我们注册一个侦听器，并且一次不获取数据。
配置由configurationReducer以状态存储，该配置将配置加载到componentDidMount上的存储中。我们看到这可以通过redux-logger运行。 reducer的初始状态是一个空数组。

问题：

套接字侦听器中的helper方法只能访问配置的初始状态，并且传递的props不会被更新。

问题：

componentDidMount（）是注册套接字侦听器的最佳位置吗？
如何传递配置道具或使当前状态可用于侦听器的回调函数？
doSomething（data）帮助器方法中有一些逻辑，用于将数据解析为人类可读的对象。当前，这是由ES6类（帮助程序类）完成的。这是正确的地方还是逻辑应该在减速器中进行？

更新1： 我通过为我的套接字连接实现中间件来解决它，如此处推荐的：https://redux.js.org/faq/codestructure#where-should-websockets-and-other-persistent-connections-live和本示例：https://gist.github.com/markerikson/3df1cf5abbac57820a20059287b4be58

然后，我使用“ store.getState（）。configuration”传递状态下的配置。如果仍然有人对我的问题有建议，我将很高兴听到他们的建议。

class MyApp extends Component {
    componentDidMount() {
        // ... create socket, connect to server
        // add configuration to state by reducer = [ configuration: [ 'config1': 1, 'config2': 2 ] ]

        // register listener to handle data, https://nodejs.org/api/net.html
        socket.on('data', (data) => {
            doSomething(data);
        });

        const { configuration } = this.props; // I think here is the problem, because componentDidMount does only have access to the initial state.
        function doSomething(data) {
            console.log(configuration); 
            // first problem: configuration is always initial state = [] and will not be updated.
        }
    }
}
const mapStateToProps = state => {
    return {
         configuration: state.configuration,
    };
};
export default connect(mapStateToProps)(MyApp);

React Native和Redux在侦听器中获取当前状态

0 个答案: