VueX基本使用方法

news/2024/7/10 0:58:38 标签: html5, html, css, vue
htmledit_views">

Vuex作用

集中管理项目公共数据

为什么不直接创建一个全局变量来代替Vuex?

  1. Vuex 是响应式的
  2. Vuex 可以跟踪每一个状态的变化

基本使用方法

  1. 创建state
  2. 获取state 中数据的方式:
    1. {{ $store.state.count }}
    2. 在computed 中定义方法,返回 this.$store.state.count
    3. 批量获取state 中的数据
  3. 修改state 数据      mutation 和commit
    1. 在mutation 中 定义方法:this.$store.commit('方法名称',参数) 不要写异步,否则不可追踪
  4. getters:类似语computed
  5. action: 定义调用mutation 中方法中的方法,异步方法

http://www.niftyadmin.cn/n/861226.html

相关文章

diff 算法

1.patch 函数中对新老节点进行比较 如果新节点不存在,销毁老节点如果老节点不存在,直接创建新的节点相同节点,进入patchVnode 的过程,比较节点内部 2.比较两个虚拟节点内部 完全相同,返回vnode 的children 不是textN…

vue渲染过程

1.响应式: 由object.definproperty 方法的setter 和getter 方法实现响应监听(发布-订阅者) 2.模板编译: 将模板编译成render 函数,执行render 函数生成虚拟dom 3.path(diff 算法): 通过patch 方法进行虚拟dom 的比较…

面向对象的三大特点?

封装,继承,多态

元素——块级元素、行内元素、行内块元素

块级元素:div p h1~h6 ul 行内元素:a span input select img

Cookie 和localStorage、SessionStorage 区别

存储大小: Cookie(小饼干)4K Storage 5M 有效期: Cookie 有有效期 Storage永久存储(localStorage 永久 SessionStorage 到页面关闭) 路径: Cookie 有路径限制 Storage 只存储在域名下 API: Cookie 没…

节流 防抖

节流: 这种是你一直点,但是它还是在设置的x 秒响应,无论你点多少次,都是在规定时间内访问。 防抖: 即在你点击的最后一次开始计时,达到设置的x 秒, 响应 顾名思义,防止手抖,这种对于淘宝双11 来说…

js面向对象编程

js面向对象编程js使用构造函数作为对象的模板.var Vehicle function() {this.price 1000;};生成对象实例var v new Vehicle();v.price;//1000传参数的构造函数var Vehicle function(value) {this.price value;}var v new Vehicle(500);prototype对象对象原型的…

setTimeout 和setInterval 区别

setTimeout: 在自定义时间到了之后,运行一次setTimeout 代码 setInterval: 在自定义时间到了之后,循环往复执行setInterval 代码