uni-app里的全局变量与数据持久化
全局变量
globalData
在 App.vue 可以定义 globalData ,globalData支持vue和nvue共享数据
定义:App.vue
js中操作globalData的方式如下:
赋值:getApp().globalData.text = 'test'
取值:console.log(getApp().globalData.text) // 'test'
如果需要把globalData的数据绑定到页面上,可在页面的onshow声明周期里进行变量重赋值。
vue的状态管理模式
uni-app是基于vue的,因此也可以使用vue的状态管理模式,来保持和持久化数据
使用vuex管理共享状态
vuex-persistedstate
用来持久化
import Vue from 'vue'
import App from './App'
import store from './store'
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
store,
...App
})
app.$mount()
在store.js中
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const store = new Vuex.Store({
state: {
count: 0,
name:''
},
getters: {
name:(state)=>{
return state.name
}
},
mutations: {
increment (state) {
state.count++
},
changeName (state,aname) {
state.name=aname
}
},
actions: {
increment (context) {
context.commit('increment')
}
}
})
export default store
共有 0 条评论