vab-logo setup

package.json

@@ -23,7 +23,7 @@
     "remixicon": "^2.5.0",
     "vue": "^3.0.5",
     "vue-router": "^4.0.3",
-    "vuex": "^4.0.0-rc.2"
+    "vuex": "^4.0.0"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "^4.5.9",
@@ -35,12 +35,12 @@
     "body-parser": "^1.19.0",
     "chalk": "^4.1.0",
     "chokidar": "^3.5.1",
-    "eslint": "^7.18.0",
+    "eslint": "^7.19.0",
     "eslint-plugin-prettier": "^3.3.1",
     "eslint-plugin-vue": "^7.5.0",
     "filemanager-webpack-plugin": "^3.1.0",
     "image-webpack-loader": "^7.0.1",
-    "less": "^4.1.0",
+    "less": "^4.1.1",
     "less-loader": "^7.3.0",
     "lint-staged": "^10.5.3",
     "prettier": "^2.2.1",

src/layout/vab-logo/index.vue

@@ -7,16 +7,19 @@
 </template>
 
 <script>
+  import { computed } from 'vue'
   import VabIcon from '@/layout/vab-icon'
-  import { mapGetters } from 'vuex'
+  import { useStore } from 'vuex'
+
   export default {
     name: 'VabLogo',
     components: { VabIcon },
-    computed: {
-      ...mapGetters({
-        logo: 'settings/logo',
-        title: 'settings/title',
-      }),
+    setup() {
+      const store = useStore()
+      return {
+        logo: computed(() => store.getters['settings/logo']),
+        title: computed(() => store.getters['settings/title']),
+      }
     },
   }
 </script>