编写 (async) actions

您所在的位置:网站首页 action和reaction 编写 (async) actions

编写 (async) actions

2024-07-11 22:07| 来源: 网络整理| 查看: 265

  开始纠错编写行为(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