使用uniapp开发时,可以通过在app.vue中定义全局变量,在没个页面内通过globalData获取
1、app.vue文件内部的写法
<script> export default { globalData: { text: 'text' }, onLaunch: function() { console.log('App Launch') }, onShow: function() { console.log('App Show') }, onHide: function() { console.log('App Hide') } } </script> <style> /*每个页面公共css */ </style>
2、在每个下级文件内的写法
onLoad() { var globalData = getApp().globalData.text; //获取全局变量 getApp().globalData.text = 'abc'; //修改全局变量 console.log(globalData); console.log(getApp().globalData.text); },
3、需要注意的是,如果需要在app.vue中获取这个全局变量,需要按以下写法
onLaunch: function() { console.log(this.$scope.globalData.text) console.log('App Launch') },
class名的配置及使用:
<!-- 与vue相同,isActive为true时class=active,反之无 --> <view :class="{ active: isActive }">111</view> <!-- 对应的value值为true时class为键值,反之无 --> <view class="static" v-bind:class="{ active: isActive, 'text-danger': hasError }">222</view> <!-- 数组内每一项的value值,对应为标签的class名 --> <view class="static" :class="[activeClass, errorClass]">333</view> <!-- 前面根据三目判断有无isActive这个class名,后面errorClass对应的value值为class名 --> <view class="static" v-bind:class="[isActive ? activeClass : '', errorClass]">444</view> <!-- 前面根据bool判断有无isActive这个class名,后面errorClass对应的value值为class名 --> <view class="static" v-bind:class="[{ active: isActive }, errorClass]">555</view>