应用于大型项目,单页面没必要使用,想要的页面效果没法实现,可以用vuex实现
在main.js注册
import store from '/store'
new Vue({
store//全局注册store ,在vue任意组件内通过this.$store访问vuex
})
1.在store文件夹加中,创建index.js
在index.js中引入vuex
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
let store=new Vuex.Store({
state,
mutations,
actions,
getters
})
2.创建state.js 保存全局变量和数据 ,并在文件中 export default {
data1:[]
}
3.创建actions.js 接收需要改变的全局方法和ajax 需要导入axios 和通过解构的变量 import {SETDATA1} from './mutations-type'
export default {
async requestData1({commit}){
let url=''
let result =await axios.get(url)
console.log(result)
commit(SETDATA1,result)
}
}
4.创建mutations.js 通过解构的变量 import {SETDATA1} from './mutations-type'
export default{
[SETDATA1](state,data){
state.data1=data
}
}
5.创建mutations-type.js