javascript - Dispatch 不会立即更新组件

标签 javascript reactjs flux

作为引用,我正在关注 this教程。我的试用应用程序是一个用户管理工具。当前显示下面的用户列表是商店代码。它使用 dispatcher.dispatch({type: "CREATE_USER", name: "Andrew"}) 成功将用户添加到列表中。然而,直到我点击一条路线然后它才会更新,它才会这样做。

    import { EventEmitter } from "events";

    import dispatcher from "../Dispatcher";

    class UserManagement extends EventEmitter{
        constructor(){
            super();
            this.users =
                [
                {
                    id: 1234,
                    name: 'Anton',
                    email: 'escalante.anton@outlook.com'
                },
                {
                    id: 12345,
                    name: 'Bacon',
                    email: 'bacon@me.com'
                }
                ];
        }
        getAll(){
            return this.users;
        }
        createUser(name){
            const id = Date.now();
            this.users.push({
                id,
                name,
                email: 'default@email.com'
            });
            this.emit("change");
        }

        handleActions(action){
            switch(action.type){
                case "CREATE_USER":{
                    this.createUser(action.name);
                    break;
                }
            }
        }
    }
    const userobj = new UserManagement;
    dispatcher.register(userobj.handleActions.bind(userobj));
    window.dispatcher = dispatcher;

    export default userobj;

编辑我想我需要触发状态更改?

最佳答案

要重新渲染数据,您应该通过调用setState或使用forceUpdate强制渲染来触发渲染

请注意,不推荐使用forceUpdate,组件读取存储数据的正确方法是将数据复制到 state 中并在渲染函数中从 this.state 读取。

http://blog.andrewray.me/flux-for-stupid-people/

关于javascript - Dispatch 不会立即更新组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37291311/

相关文章:

javascript - 在 Visual Studio 中编辑 HTML 文件时支持 Javascript 模板标记

javascript - 如何传递react.js数据来创建类似meteor.js或relay.js的容器

javascript - ReactJS - super 表达式必须为 null 或函数,而不是未定义

javascript - 在 react 路由器中通过 Prop 传递功能

reactjs - 为什么我应该保持状态平坦

javascript - 如何将参数从 Tornado 传递到 js 文件而不是 html?

javascript - 根据位置修改 Twitter Bootstrap 的工具提示颜色

javascript - 如何在Reactjs中通过简单的for循环进行渲染?

javascript - IE 11 未在 SVG map 上触发 Mouseenter 或 Mouseleave 事件

Kubernetes 如何进行 Deployment 来更新镜像自动 CI/CD