您的位置:首页 > Web前端 > Vue.js

uniapp中使用vue语法定义全局变量

2020-06-05 17:27 671 查看

**前言:**在用uniapp写移动端的时候需要调用后台接口返回的值,然后这个值可以在全局使用。

具体步骤:
1.新建js文件,common.js;
2.在common.js中首先定义一个全局变量,并给他赋初始值,比如:style;

export default {
memberObj:{
//1 普通  2幼儿园  3高中  4节日
style:3,
className:"大班",
isTest:false,

},
}
// setMemberObj(data){

// this.memberObj = Object.assign({},this.memberObj,data)
// }
}

3.然后在App.vue中调用后台接口获取值,并把值回调给变量,即可实现动态给变量赋值,并可全局使用

onShow: function() {
//promiseGetRequest是封装好的promise同步接口
var _this=this;
request.promiseGetRequest('接口地址')
.then(res=>{
console.log(res.data.d[0])
_this.$member.memberObj.style=res.data.d[0].themeId;
_this.style=_this.$member.memberObj.style;
// console.log(_this.style)
switch(_this.style){
case 1:
document.body.style.backgroundImage="linear-gradient(180deg, #50ABFA, #666FF6)"
break;
case 2:
document.body.style.background="url("+this.imgServerUrl+"/bg2.png) no-repeat";
document.body.style.backgroundSize="100% 100%"
break;
case 3:
document.body.style.background="url("+this.imgServerUrl+"/bg3.png) no-repeat";
document.body.style.backgroundSize="100% 100%"
break;
case 4:
document.body.style.background="url("+this.imgServerUrl+"/bg4.png) no-repeat";
document.body.style.backgroundSize="100% 100%"
// document.body.style.backgroundImage="linear-gradient(180deg, #50ABFA, #666FF6)"
break;
}
})
},
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: