bus 开胃小菜
- 目的是解决兄弟组件之间的通信问题
目录解构
1 | ├── index.html |
bus.js
1 | import Vue from 'vue' // 导入 Vue 生成实例并且导出 |
main.js
1 | import Bus from './bus' // 假设是同级关系 |
组件间通信 a.vue 到 b.vue
1 | // 在 a.vue 的 方法中 |
1 | // 在 b.vue 的 钩子函数中 mounted |
vuex 基操
基本的目录解构
1 | ├── index.html |
store/index.js
1 | import Vue from "vue"; |
main.js 入口文件
1 | import Vue from 'vue' |
/store/state.js 根级 state
1 | // export default { // 简洁写法 |
/store/modules/user.js 模块
1 | const state = { |
state 取值相关
- 展示组件中获取 根级别 以及 模块中
state
的值 下面展示了组件中的script
部分, 后续将简写
1 | <script> ############# 1. 基本操作获取 state |
getters 方法取值
1 | const getters: { |
1 | computed: { |
moutations 方法
1 | const mutations = { |
1 | methods: { |
actions 方法
1 | const actions = { |
1 | methods: { |
动态加载模块
1 | methods: { |