使用vue-element-admin的一些总结
3 / 0 / 创建于 4年前
已下线 的个人博客
最近开发的项目后台基于 vue-element-admin 开发，在逐步完善的过程中遇到了一些问题，特此总结，希望能对你有所帮助。
先上链接，真的很好用，安利一下，链接如下：
基本上常用的不常用的功能都有，就不多说了，有兴趣链接直达，正式开始正文。
修改菜单图标为 elementUI 图标#
官方的 svg 图标确实比较少，添加我也觉得繁琐，另外，既然集成了 elementUI，直接用 elementUI 图标就好了。
改：
修改菜单icon为elementUI图标：
// 文件地址：src\layout\components\Sidebar\Item.vue
// if (icon) {
// vnodes.push(<svg-icon icon-class={icon}/>)
// }
if (icon) {
vnodes.push(<i class={icon}></i>)
}关闭 eslint#
官网已有答案
// vue.config.js
lintOnSave: falsebut，如果你使用的是 git 管理代码，会发现 commit 的时候依旧会触发 eslint。
// package.json
"lint-staged": {
"src/**/*.{js,vue}": [
"eslint --fix", // 删除这一行
"git add"
]
},增加本地环境变量#
// package.json
"scripts": {
"local": "vue-cli-service serve --mode local",
...
},复制.env.production 为.env.local，自定义配置后，运行：
yarn run local缓存页面#
想缓存的页面：
<script>
export default {
name: "cacheIndex",加入 cachedViews
// src\store\modules\tagsView.js
const state = {
visitedViews: [],
cachedViews: [
'cacheIndex'
]
}最近开发的项目后台基于 vue-element-admin 开发，在逐步完善的过程中遇到了一些问题，特此总结，希望能对你有所帮助。
先上链接，真的很好用，安利一下，链接如下：
基本上常用的不常用的功能都有，就不多说了，有兴趣链接直达，正式开始正文。
修改菜单图标为 elementUI 图标#
官方的 svg 图标确实比较少，添加我也觉得繁琐，另外，既然集成了 elementUI，直接用 elementUI 图标就好了。
改：
修改菜单icon为elementUI图标：
// 文件地址：src\layout\components\Sidebar\Item.vue
// if (icon) {
// vnodes.push(<svg-icon icon-class={icon}/>)
// }
if (icon) {
vnodes.push(<i class={icon}></i>)
}关闭 eslint#
官网已有答案
// vue.config.js
lintOnSave: falsebut，如果你使用的是 git 管理代码，会发现 commit 的时候依旧会触发 eslint。
// package.json
"lint-staged": {
"src/**/*.{js,vue}": [
"eslint --fix", // 删除这一行
"git add"
]
},增加本地环境变量#
// package.json
"scripts": {
"local": "vue-cli-service serve --mode local",
...
},复制.env.production 为.env.local，自定义配置后，运行：
yarn run local缓存页面#
想缓存的页面：
<script>
export default {
name: "cacheIndex",加入 cachedViews
// src\store\modules\tagsView.js
const state = {
visitedViews: [],
cachedViews: [
'cacheIndex'
]
}本作品采用《CC 协议》，转载必须注明作者和本文链接
关于 LearnKu
粤公网安备 44030502004330号
推荐文章：