使用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>