1 <template>
2 <view>
3 <button type="primary" @click="setTitle">設置標題</button>
4 <button type="primary" @click="setColor">設置顏色（關閉加載條）</button>
5 </view>
6 </template>
7
8 <script>
9 export default { 10 data() { 11 return { 12
13 } 14 }, 15 methods: { 16 // 對標題內容進行設置
17 setTitle(){ 18 uni.setNavigationBarTitle({ 19 title: '設置的新的標題'
20 }); 21 }, 22
23 // 對顏色和進場動畫進行設置
24 setColor(){ 25 uni.setNavigationBarColor({ 26 // 字體顏色 僅支持 #ffffff 和 #000000
27 frontColor: '#000000', 28 // 背景顏色值，有效值爲十六進制顏色
29 backgroundColor: '#ff0000', 30 // animation 結構
31 animation: { 32 // duration: 動畫時間
33 duration: 2000, 34 // timingFunc:動畫效果
35 // linear 動畫從頭至尾的速度是相同的。
36 // easeIn 動畫以低速開始
37 // easeOut 動畫以低速結束。
38 // easeInOut 動畫以低速開始和結束
39 timingFunc: 'easeIn'
40 } 41 }); 42
43 // 關閉加載條
44 uni.hideNavigationBarLoading() 45 }, 46 onLoad(){ 47 // 顯示加載條
48 uni.showNavigationBarLoading() 49 } 50 } 51 } 52 </script>
53
54 <style>
55
56 </style>
