自定义导航条设置 customNavigation

src/mods/AppPhotoAlbum/AppPhotoAlbum.vue

@@ -3,15 +3,15 @@
     <div class="header" :class="[isFixed ? 'header-active' : '']">
       <div class="status-bar" :style="{height: statusBarHeight + 'px'}"></div>
       <div class="nav-bar">
-        <image src="/static/img/left.png" @click="back" />
+        <image src="/static/img/left.png" @click="back"/>
         <h2>乡村相册</h2>
       </div>
     </div>
     <div class="back-wrapper" @click="back" v-show="!isFixed" :style="{marginTop : statusBarHeight + 'px'}">
-      <image src="/static/img/left.png" />
+      <image src="/static/img/left.png"/>
     </div>
     <div class="photo-header">
-      <image :src="coverImg" mode="aspectFill" />
+      <image :src="coverImg" mode="aspectFill"/>
       <h2>{{ name }}</h2>
     </div>
     <div class="photo-info">
@@ -37,7 +37,7 @@
         <h2>{{ group.name }}</h2>
         <div class="photo-wrapper">
           <div class="photo-item" v-for="(item, i) in group.list" :key="i">
-            <image :src="item.url" @click="preview(item.url)" mode="aspectFill" />
+            <image :src="item.url" @click="preview(item.url)" mode="aspectFill"/>
             <div class="photo-item__text">
               <span>{{ item.createUserName }} 上传</span>
             </div>
@@ -54,12 +54,13 @@
 </template>
 
 <script>
-  import { mapState } from 'vuex'
+import {mapState} from 'vuex'
 
-  export default {
-    name:"AppPhotoAlbum",
-    appName:"乡村相册",
-    data () {
+export default {
+  name: "AppPhotoAlbum",
+  appName: "乡村相册",
+  customNavigation: true,
+  data() {
     return {
       isFixed: false,
       statusBarHeight: 20,
@@ -78,7 +79,7 @@
     ...mapState(['user', 'token'])
   },
 
-    onLoad (query) {
+  onLoad(query) {
     this.type = query.type
     this.name = query.name
     this.coverImg = query.url
@@ -89,18 +90,18 @@
     this.getTotalInfo(query.type)
   },
 
-    onUnload () {
+  onUnload() {
     // uni.$off('update')
   },
 
   methods: {
-      back () {
+    back() {
       uni.navigateBack({
         delta: 1
       })
     },
 
-      preview (url) {
+    preview(url) {
       let imgs = []
       this.list.forEach(item => {
         imgs = [...imgs, ...item.list.map(v => v.url)]
@@ -146,7 +147,7 @@
       })
     },
 
-      uploadFile (img, total) {
+    uploadFile(img, total) {
       uni.uploadFile({
         url: this.$http.baseURL + '/admin/file/add',
         filePath: img,
@@ -187,7 +188,7 @@
       })
     },
 
-      getTotalInfo (type) {
+    getTotalInfo(type) {
       this.$instance.post(`/app/appvillagepicturealbum/statistic?areaId=${uni.getStorageSync('areaId')}&type=${type}`).then(res => {
         if (res.code === 0) {
           this.info = res.data
@@ -195,7 +196,7 @@
       })
     },
 
-      getList (type) {
+    getList(type) {
       this.$instance.post(`/app/appvillagepicturealbum/queryAlbum?areaId=${uni.getStorageSync('areaId')}&type=${type}`).then(res => {
         if (res.code === 0) {
           this.list = Object.keys(res.data).map(v => {
@@ -218,11 +219,11 @@
   onPageScroll(params) {
     this.isFixed = params.scrollTop > 60;
   }
-  }
+}
 </script>
 
 <style lang="scss" socped>
-  .photo {
+.photo {
   padding-bottom: 130px;
 
   * {
@@ -300,7 +301,7 @@
       height: 100%;
       z-index: 1;
       color: #fff;
-        background: rgba(0,0,0, 0.1);
+      background: rgba(0, 0, 0, 0.1);
       font-size: 56px;
     }
   }
@@ -378,5 +379,5 @@
       }
     }
   }
-  }
+}
 </style>