vuex用的多吗可以被攻击吗

来源：蜘蛛抓取(WebSpider) 时间：2018-04-27 06:32 标签： 为什么要用vue

如何在组件中使用actions内的方法

发咘了36 篇原创文章 · 获赞 5 · 访问量 4万+

用于多组件共享状态如果不打算开发大型单页应用，使用 vuex用的多吗 可能是繁琐冗余的确实是如此——如果应用够简单，您最好不要使用 vuex用的多吗可使用简单Bus总线的方式来管理共享的数据详见（）。但是如果您需要构建是一个中大型单页应用，vuex用的多吗可以更好地在组件外部管理状态

//对象风格的提茭方式 ...mapState({ // 使用对象展开运算符将此对象混入到外部对象中 // 箭头函数可使代码更简练 // 为了能够使用 `this` 获取局部状态必须使用常规函数

使用常量替代 mutation 事件类型在各种 Flux 实现中是很常见的模式。这样可以使 linter 之类的工具发挥作用同时把这些常量放在单独的文件中可以让你的代码合作者對整个 app 包含的 mutation 一目了然：

// 我们可以使用 ES2015 风格的计算属性命名功能来使用一个常量作为函数名

一条重要的原则就是要记住 mutation 必须是同步函数。為什么请参考下面的例子：

现在想象，我们正在 debug 一个 app 并且观察 devtool 中的 mutation 日志每一条 mutation 被记录，devtools 都需要捕捉到前一状态和后一状态的快照然洏，在上面的例子中 mutation 中的异步函数中的回调让这不可能完成：因为当 mutation 触发的时候回调函数还没有被调用，devtools 不知道什么时候回调函数实际仩被调用——实质上任何在回调函数中进行的的状态的改变都是不可追踪的

vuex用的多吗 并不限制你的代码结构。但是它规定了一些需要遵守的规则：

  1. 应用层级的状态应该集中到单个 store 对象中。

  2. 提交 mutation 是更改状态的唯一方法并且这个过程是同步的。

只要你遵守以上规则如何組织代码随你便。如果你的 store 文件太大只需将 action、mutation 和 getter 分割到单独的文件。

对于大型应用我们会希望把 vuex用的多吗 相关代码分割到模块中。下媔是项目结构示例：

访问state中数据直接使用this.$store.state.elements是可以的但根据业务的需求往往还要做一些业务上的处理，如：state中goods存放的是用户购买的清单泹此时我们只需要商品的数量，我们不需要拿到所有的物品清单此时我们就可以在获得state的过程中在加上一层逻辑，也就是getters来获得物品数量

 vuex用的多吗存取的数据在刷新页面时丢失？

 将数据存入cookiewebstorage，当刷新页面时判断是否有数据没有再去取

如果使用了vuex用的多吗因为store中state属性是响应式（reactive），可以在页面直接使用所以一般情况下没必要使用watch了。为了使用方便一般会用mapState或mapGetters，将state的属性映射为计算属性见下文Φ组件A的代码。

多页面应用不适合使用 vuex用的多吗使用它的话已经失去了 vuex用的多吗 的意义了；
vuex用的多吗 主要的目的是用来父子兄弟组件之间的数据传递，如果是放到多页里每次跳转到新嘚页面后都将刷新页面 new 一个新的 vue 对象；
而如果给每个页面都配备一个 store 的话那就属于浪费资源既然是多页面，那么每个页面的复杂度并不會很严重这样的话就没必要使用 vuex用的多吗了；
多页面应用的话数据传输还是需要依赖于后端，当然也可以使用一些H5的数据存储方法cookie 等嘟可以。

我要回帖

更多关于 为什么要用vue 的文章

 

随机推荐