zoukankan      html  css  js  c++  java
  • vuex状态管理工具

    父子组件之间的通信  props传递  父 向子单向传递;且每次 父组件更新时  子组件的props会跟着更新;

    如果需要 子组件把数据传递给父组件,就需要在子组件上绑定自定事件 在子组件使用this.$emit()去派送事件。

    但是,多个视图依赖同一个状态?兄弟组件之间的状态传递呢?传参方法对于多层嵌套的组件将会非常繁琐。

    所以,就需要vuex负责多组件的状态管理。 

    统一页面的状态管理及操作处理,展示更新,是数据集合,类似‘随时更新的全局变量’,是“前端数据库”,让其在各页面 实现数据共享,并且可操作

    统一状态数,导致应用的所有状态集中在 一个对象中,单当应用变大时,store 对象会非常臃肿不堪。

    所以vuex允许我们将store分割到模块(module),每个module拥有自己的:

    state:统一状态树;

    getters:状态的获取;

    mutations:触发同步事件;

    action:提交 mutation可以包含异步操作;

    ============================

    获取:

    computed:{

      author:(){

        this.$store.state.author

      }  

     }

    ============相互关联=================

    设置

    <el-input  v-model="inputTxt">

      <el-button   @click="setAuthor"><el-button>

    </el-input>

    methods:{

       setAuthor:function(){

        this.$store.state.author=this.inpuTxt;

       }

    }

    vuex 失去了组件复用的功能!

    vue的热重载:页面每次改动 不需要手动  刷新  可自行刷新。

     
    Vue 爬坑之路(二)—— 组件之间的数据传递
    Vue 爬坑之路(四)—— 与 Vuex 的第一次接触
  • 相关阅读:
    数值的扩展
    字符串的扩展
    变量的解构赋值整理
    let和const命令整理
    解析vue2.0中render:h=>h(App)的具体意思
    菜单栏的显示与隐藏
    vue的事件绑定
    CSS3实现3D地球自转行星公转
    MongoDB命令的简单操作(一)
    canvas扇形进度圈动态加载
  • 原文地址:https://www.cnblogs.com/yancongyang/p/9074495.html
Copyright © 2011-2022 走看看