编写 (async) actions |
您所在的位置:网站首页 › action和reaction › 编写 (async) actions |
开始纠错编写行为(Actions)
使用 MobX 来编写 Action 是一件非常直观的事情。只需要创建、改变或者删除数据,MobX 会确保相应的一切都改变,因为 Store和组件都依赖于你的数据。 以之前创建的这个 Store 为例,Action 可以像这样简单: var todo = todoStore.createTodo(); todo.task = "make coffee";这样就能简单地创建 todo,然后就可以提交给服务器和更新UI。 什么时候使用 Actions?Actions 应该只用于改变状态。 提供查阅、过滤的函数不应该被标记为 Action 以允许 MobX 追踪它们的调用。 异步 Action编写一个异步 Action 也很简单。直接用就可以了。 // ... this.isLoading = true; this.transportLayer.fetchTodos().then(fetchedTodos => { fetchedTodos.forEach(json => this.updateTodoFromServer(json)); this.isLoading = false; }); // ...在异步 Action 完成之后,更新数据后 View 就会更新。 import {observer} from "mobx-react"; var TodoOverview = observer(function(props) { var todoStore = props.todoStore; if (todoStore.isLoading) { return Loading...; } else { return { todoStore.todos.map(todo => ) } } });上面这个组件当 isLoading 改变的时候会自动更新,或者 isLoading 为true且 todos 改变也会自动更新。 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |