uniapp 设置导航栏（NavigationBar）

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>