Question

所以从技术上讲，我有2个组件，我从1日开始调度事件，我想在2日检测到此更改。我做了与Redux文档中有关商店订阅的所有操作：https://redux.js.org/api/store#subscribe。不幸的是，它对我不起作用。

这是我的第一反应项目。（vue / x更好：]）

import React, {Component} from 'react';
import reducers from '../../reducers'
import { Dropdown } from 'semantic-ui-react'
import {translate} from "../../actions";
import createStore from "../../createStore";

const store = createStore(reducers)

class Component1 extends Component {

    componentDidMount() {
        store.subscribe(() => console.log(1));
    }

    updateTexts(lang) {
        store.dispatch(translate(lang));
    }


    render() {
            this.dropdown = <Dropdown
            onChange={this.updateTexts}
            />

        return (
            <div className={"lang-switcher"}>
                 <div className={"select-lang"}>
                    {this.dropdown}
                </div>
            </div>
        );
     }
 }

export default Component1

import React, {Component} from 'react';
import axios from 'axios';
import {Animate} from 'react-animate-mount';
import createStore from "../../createStore";
import reducers from "../../reducers";

const store = createStore(reducers);

export default class Component2 extends Component {

    componentDidMount() {
        store.subscribe(console.log(2));
    }

    render() {
         return (
            <div className="box">
                {Something}
            </div>
        );
    }
}

我希望Component2将检测到由Component1完成的状态更改。 Reducer工作正常，调度后更新状态。

Answer 1

如果您使用的是React，请you should be using the React-Redux library to handle interacting with the store。

也就是说，您似乎还要创建两个不同的商店实例，每个组件文件中一个。因此，组件2不知道组件1文件中的存储实例。

Answer 2

请创建一个脚本Store.js，并为每个组件导入。使用export时，这将根据您的export常量创建一个单例：

Store.js

int *allocIntArray(int size) {
int *newarr = nullptr;

newarr = new int[size];

return newarr;
}

并用作：

import reducers from '../../reducers'
import createStore from "../../createStore"
export default createStore(reducers)

商店订阅在外部组件中不起作用

2 个答案: