新增页面导航区域

“dzb”

2022-11-03 1d81702468678e5b2e46916a4369429fdb1d8b4b

新增页面导航区域

 dist.rar

Binary files differ

 package-lock.json

@@ -1933,29 +1933,6 @@
        "webpack-merge": "^5.7.3",
        "webpack-virtual-modules": "^0.4.2",
        "whatwg-fetch": "^3.6.2"
      },
      "dependencies": {
        "@vue/vue-loader-v15": {
          "version": "npm:vue-loader@15.10.0",
          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.10.0.tgz",
          "integrity": "sha512-VU6tuO8eKajrFeBzMssFUP9SvakEeeSi1BxdTH5o3+1yUyrldp8IERkSdXlMI2t4kxF2sqYUDsQY+WJBxzBmZg==",
          "dev": true,
          "requires": {
            "@vue/component-compiler-utils": "^3.1.0",
            "hash-sum": "^1.0.2",
            "loader-utils": "^1.1.0",
            "vue-hot-reload-api": "^2.3.0",
            "vue-style-loader": "^4.1.0"
          },
          "dependencies": {
            "hash-sum": {
              "version": "1.0.2",
              "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
              "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
              "dev": true
            }
          }
        }
      }
    },
    "@vue/cli-shared-utils": {
@@ -2062,6 +2039,27 @@
          "version": "2.1.2",
          "resolved": "https://registry.npmmirror.com/yallist/-/yallist-2.1.2.tgz",
          "integrity": "sha512-ncTzHV7NvsQZkYe1DW7cbDLm0YpzHmZF5r/iyP3ZnQtMiJ+pjzisCiMNI+Sj+xQF5pXhSHxSB3uDbsBTzY/c2A==",
          "dev": true
        }
      }
    },
    "@vue/vue-loader-v15": {
      "version": "npm:vue-loader@15.10.0",
      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.10.0.tgz",
      "integrity": "sha512-VU6tuO8eKajrFeBzMssFUP9SvakEeeSi1BxdTH5o3+1yUyrldp8IERkSdXlMI2t4kxF2sqYUDsQY+WJBxzBmZg==",
      "dev": true,
      "requires": {
        "@vue/component-compiler-utils": "^3.1.0",
        "hash-sum": "^1.0.2",
        "loader-utils": "^1.1.0",
        "vue-hot-reload-api": "^2.3.0",
        "vue-style-loader": "^4.1.0"
      },
      "dependencies": {
        "hash-sum": {
          "version": "1.0.2",
          "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
          "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
          "dev": true
        }
      }
@@ -9214,7 +9212,7 @@
    },
    "vue-hot-reload-api": {
      "version": "2.3.4",
      "resolved": "https://registry.npmmirror.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
      "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
      "integrity": "sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==",
      "dev": true
    },

 package.json

@@ -1,7 +1,7 @@
{
  "name": "my-app",
  "version": "0.1.0",
  "private": true,   
  "private": true,
  "scripts": {
    "dev": "vue-cli-service serve --mode development",
    "test": "vue-cli-service serve --mode production",

 src/views/layout/components/Main/index.vue

@@ -2,7 +2,9 @@
  <el-main>
    <!-- <NavBar /> -->
    <div class="content">
      <router-view></router-view>
      <!-- 页面导航区域 -->
      <div class="page-nav" v-if="navFlag"></div>
      <router-view v-else></router-view>
      <!-- 底部区域 -->
      <!-- <MyFooter/> -->
    </div>
@@ -17,6 +19,16 @@
  components: {
    // MyFooter,
    NavBar
  },
  data() {
    return {
      navFlag:true
    }
  },
  watch:{
    '$route.path'(newPath,oldPath){
      newPath === '/home' ? this.navFlag = true : this.navFlag = false
    }
  }
};
</script>