Vuex

  1. 为什么使用Vuex

前端系列课程之Vuex

例子:(使用Vue方法:)

前端系列课程之Vuex
新建(一):

前端系列课程之Vuex

新建(二):

前端系列课程之Vuex

将新建的两个文件导入 About中,做子组件:

前端系列课程之Vuex

事件总线:(全局定义)

前端系列课程之Vuex
在新建(一)添加:

前端系列课程之Vuex

在新建(二)中添加:

前端系列课程之Vuex
(上面适用于小项目开发)

  1. Vuex原理:

前端系列课程之Vuex

一、安装 vuex

前端系列课程之Vuex
二、创建仓库文件

1.创建文件夹
前端系列课程之Vuex

2. 在文件夹中创建文件:

前端系列课程之Vuex
3.在新建文件中导入:

前端系列课程之Vuex
4.导入到main.js

前端系列课程之Vuex

  • Vuex原理
    > store中通过state管理数据,实现数据在组件之间共享
    > Vuex和本地存储的区别
    > Vuex临时保存在内存中,本地存储可以持久保存
    > Vuex针对组件间共享数据,本地存储针对多页面间共享数据
    > Vuex保存数据类型不限,本地存储只能保存字符串

新建两个文件

前端系列课程之Vuex
前端系列课程之Vuex

在About.vue中导入
前端系列课程之Vuex
(上图未截全,script中配置类似如下:)
前端系列课程之Vuex

相关文章:

  • 2021-05-11
  • 2021-06-22
  • 2021-12-03
  • 2021-07-25
  • 2021-12-23
猜你喜欢
  • 2021-05-14
  • 2021-06-19
  • 2021-08-25
  • 2021-09-19
  • 2021-11-17
  • 2021-09-13
相关资源
相似解决方案