zoukankan      html  css  js  c++  java
  • vuex promise async await

    vue权限控制路由

    用户登录后返回权限菜单,前端根据权限菜单动态添加路由,然后再动态生成菜单栏
    思路是

    1. 在router.js中定义初始化默认路由
    2. 动态配置路由
    3. 通过匹配,把匹配好的路由数据addRoutes到路由中
    4. 为了防止刷新后路由数据被清空,可以用判断是否登录的方式再次加载动态路由

    vuex

    • store文件夹下心间js文件
    • js文件中引入vue和vuex,完了在main.js中把store引入进来
    • state 用来自定义一些变量保存数据
    • mutations用来定义一些方法,用户通过调用这些方法来改变数据,可传一个参数或者两个,第一个参数state是默认的,第二个参数就是用户传入的值,然后在方法中赋值给state中的变量。
    • getter:从基本数据state派生出来的数据,相当于store的计算属性,getter的返回值会根据它的依赖被缓存起来,且只有当它的依赖值发生了改变才会被重新计算
    • action提交的是mutation,而不是直接变更状态
    • modules:模块化vuex,可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰,管理更为方便。

    存值。需要把当前的数据保存到vuex中

    1. 同步
      this.$store.commit("mulations中的方法名",数据值)
    2. 异步用
      this.$store.dispatch("actions中的方法名",数据值)

    取值

    1. 同步
      this.$store.state.方法名
    2. 异步
      this.$store.getter.方法名
      当操作行为中含有异步操作,比如向后台发送请求数据,就需要使用action的dispatch来完成了,其他使用commit即可。

    promise

    promise对象表示一个异步操作,有三种状态pending(进行中)、fufilfed(已成功)、rejected(已失败)。只有异步操作的结果才能决定当前是哪一种状态,任何操作都无法改变这种状态。
    一旦状态改变就不会再变,任何时候都可以得到这个结果。promise对象的状态改变,只有两种可能:从pending变成fufilfed和从pending变成rejected。只要这两种情况发生,状态就凝固了,不会再变了,这时就称为resolved(已定型)。如果改变已经发生了,你再对promise对象添加回调函数,也会立即得到这个结果。

    async await

    async await基本是组合使用的 async用来声明一个异步方法,返回的是一个promise对象,获取对应的返回值需要用到.then方法。
    await只能在async里面使用,让后面的执行要等到当前await方法的结果后才能继续执行。

  • 相关阅读:
    《孙子兵法》【行军第九】
    《孙子兵法》【虚实第六】
    《孙子兵法》【地形第十】
    企业无线局域网的搭建
    企业无线局域网的搭建
    UDDI
    (转载)Linux:Ldd命令介绍及使用方法
    (转载)传递给const引用形参的实参要求
    (转载)千万不要把bool设计成函数参数
    (转载)Linux下如何修改终端提示符?
  • 原文地址:https://www.cnblogs.com/zhangkeke/p/15596673.html
Copyright © 2011-2022 走看看