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>
