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

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

이 튜토리얼의 운영 환경: 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)
   }       
}

에서 전역 변수를 재할당합니다. 관련 무료 학습 추천 : php 프로그래밍(동영상)

위 내용은 uniapp에서 전역 변수를 수정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!