代码拉取完成,页面将自动刷新
Quasar-Manage 是一款中后台前端解决方案:
当然如果你想使用基于VUE-CLI
版本的:Vue-Quasar-Manage
使用这个项目前您需要了解如下技术栈:
ES6 | Node.js | Webpack | Vue | Vuex | Vue-Router | Vuex | Quasar-cli | Axios | ESlint | Electron:如果需要
<tagView>
文本不居中的问题icon
改为非必要,优化没有icon
时<tagView>
和<Breadcrumbs>
的显示问题query
参数时,<tagView>
和<breadcrumbs>
会默认加上第一个参数的值作为标识并显示(之前沙雕了用的params
)<keep-alive>
缓存失效,需要进行一次路由切换才能正常缓存的问题:
经过测试是由于用来做嵌套路由的<layout>
组件按需引入导致的,<layout>
组件的按需引入由于是异步操作,会使嵌套路由的第一次拍平操作失效方法 1 : 如果你不想修改源码,在asyncRoutes.js
中对于<layout>
不使用按需引入即可
import layout from '../components/Layout/layout'
{
path: '/start',
name: 'start',
component: layout,
children: [{...}]
}
方法 2 (兼容按需加载): 修改permission.js
中的handleKeepAlive
方法为 async/await
async function handleKeepAlive (to) {
if (to.matched && to.matched.length > 2) {
for (let i = 0; i < to.matched.length; i++) {
const element = to.matched[i]
if (element.components.default.name === 'Layout') {
to.matched.splice(i, 1)
await handleKeepAlive(to)
}
if (typeof element.components.default === 'function') {
await element.components.default()
await handleKeepAlive(to)
}
}
}
}
经过测试两种方式都可行,不过,总觉得递归和异步套着来一点都不爽 ┗( ▔, ▔ )┛,所以我用第一种...能简单解决的问题,何必复杂化捏...
之后 Electron 版本的更新将在 Electron 分支进行,感谢 CloudWoR 提供的支持
请确保您的计算机已经安装了 Node.js
以及 git
,当前项目主要用于展示说明文档
1、克隆项目
## 克隆模板项目
git clone https://github.com/972784674t/quasar-manage-template.git
2、下载项目所需依赖
yarn install
3、启动开发服务器
## 运行 SPA 版本
quasar dev
## 运行 Electron 版本
quasar dev -m electron
quasar build
Copyright (c) 2015-present Razvan Stoenescu
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。