第17章 前端之全局存储:Vuex=Store Store用于对数据进行存储,并共享以为所有需要的Vue页面中的调用提供数据及其方法支撑;Vuex是Store的内置引用包,即如果想要前端Vue程序支撑Store必须在新建Vue程序;如果Vue程序没有引用Vuex包则,在Vue程序引用Vuex包。 1 定义src\store\index.js import { createStore } from 'vuex' export default createStore({ state: { token: null,//实例化“TokenJwt”字符串。 tokenExpire: null,//实例化“TokenJwt”字符串的过期时间。 }, getters: {}, mutations: { //通过该方法把“TokenJwt”字符串,进行全局存储。 saveToken: function(state, data) { state.token = data;
2023-01-05 16:18:32 60.2MB vue3 HBuilderX 前后端分离 博客实现
1
1导入“element-plus:Icon”组件 1.1“element-plus:Icon” 组件导入命令: npm install @element-plus/icons-vue 1.2“element-plus:Icon” 组件配置: 在“main.js”文件中定义如下配置: import { createApp } from 'vue'//在vue-cli4(4.5.0版本的脚手架)后取代了:import Vue from 'vue'; //把“element-plus”模板插件【导入】为全局变量:“ElementPlus”。 import ElementPlus from 'element-plus' import zhCn from 'element-plus/es/locale/lang/zh-cn';//ElementPlus 组件内部默认使用英语,使用中文语言。 import 'element-plus/dist/index.css' //把“element-plus icon”的所有图标【导入】为全局变量:“ElementPlusIconsVue”。 impo
2023-01-05 16:18:31 49.92MB vue3 HBuilderX 前后端分离 前端
1
//注意:path属性所对应的字符串不能与“*.vue”文件名相同否则会出现错误。 const routes = [{ path: '/Login', name: '登录', component: () => import('../views/LoginView.vue') }, { path: '/', name: 'Admin', component: () => import('../components/AdminLayoutComponen.vue'), children: [{ path: '/',//默认启动页,默认加载子路径与父路径相同的情况下会自动加载。 name: '欢迎', icon: "HomeFilled", menuId: '1', component: () => imp
2023-01-05 16:18:30 52.94MB vue3 HBuilderX 前后端分离 前端
1
1重构:src\components\AdminLayoutComponen.vue(el-menu刷新保持当前菜单选项)