uniapp에서 전역 변수를 수정하는 방법-uni-app-php.cn

uniapp에서 전역 변수를 수정하는 방법: 1. 일반 페이지에서 전역 변수를 얻고 값을 다시 할당합니다. 2. Vue의 상태 관리 도구인 vuex를 통해 전역 변수를 관리합니다. 코드는 [let str = contObj.str;]입니다.

uniapp에서 전역 변수를 수정하는 방법

이 튜토리얼의 운영 환경: windows7 시스템, uni-app2.5.1 버전 이 방법은 모든 브랜드의 컴퓨터에 적합합니다.

추천(무료):uni-app development tutorial

uniapp에서 전역 변수 수정 방법:

1. common common.js 참조 (1. 해당 페이지에서 common.js를 직접 소개할 수 있습니다. 2. main에서 참조되고 .js에 마운트됩니다(여기에는 두 번째 유형이 있습니다)

export default { memberObj:{ name:'初始姓名', }, setMemberObj(data){ this.memberObj = Object.assign({},this.memberObj,data) } }

로그인 후 복사

(1). 전역 main.js에서 참조됩니다.

import Vue from 'vue' import App from './App' import member from './common/common.js' import store from './store' Vue.config.productionTip = false Vue.prototype.$store = store Vue.prototype.$member = member; Vue.prototype.$enName = 'ming'; App.mpType = 'app' const app = new Vue({ store, ...App }) app.$mount()

로그인 후 복사

일반 페이지에서 전역 변수를 가져오고 값

onShow:function(){ //获取全局设置的变量 this.memberData = this.$member.memberObj; console.log(this.memberData); //输出值{name:'初始姓名'} }, methods: { bindLogin() { let that = this; let obj = { name:'爱尚', sex:'男' } that.$member.setMemberObj(obj); }, } //再次在别的页面调用时内容已发生变化 console.log(this.$member.memberObj) //{name:'爱尚',sex:'男'}

로그인 후 복사

을 다시 할당합니다. vue를 통해 관리 도구인 vuex는 전역 변수를 관리합니다

1、创建store文件，store.js import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const store = new Vuex.Store({ state: { memberData:'', initName:'' }, mutations: { copy(state,cont){ //单一的改变某一个变量 console.log(state) console.log(cont) state.memberData = cont; }, change(state,contObj){ //通过传入的变量去改变对应的全局变量 let str = contObj.str; let cont = contObj.cont; state[str] = cont; }, }, actions:{ copeFun:function(context,mData){ context.commit('copy',mData) }, changeFun:function(context,obj){ context.commit('change',obj) } } }) export default store

로그인 후 복사

1. main.js에 store.js를 도입합니다

import Vue from 'vue' import App from './App' import store from './store'; Vue.config.productionTip = false; Vue.prototype.$store = store; App.mpType = 'app'; const app = new Vue({ store, ...App }) app.$mount()

로그인 후 복사

2. 페이지에서 사용해야 하는 전역 변수를 얻습니다

(1), global을 통해 직접 얻습니다. 마운팅(모니터링 변수의 실시간 재할당을 용이하게 하기 위해 계산된 속성에 정의)

1、直接通过全局挂载的那种方式去获取 computed:{ memberData:function(){ return this.$store.state.memberData; }, },

로그인 후 복사

(2), 페이지에 vuex를 도입하여

import {mapState,mapMutations} from "vuex"； computed:{ 　　//正常写法 ...mapState({ memberData:state => state.memberData, initName:state => state.initName, }) 　　//当变量名一致时（简写） 　　//...mapState(['initName','memberData']) },

로그인 후 복사

를 얻습니다

3. vuex

methods:{ //单一方法改变指定的变量 changeMember:function(){ let mem = { name:'爱尚丽明', age:'28' } this.$store.dispatch('copeFun',mem) }, //通过传入要改的变量名进行改变变量 changeMemberPub:function(){ let memberData = { name:'爱尚', age:25 } let $obj = {} $obj.cont = memberData ; $obj.str = 'memberData' this.$store.dispatch('changeFun',$obj) } }

로그인 후 복사