vue-admin-html,vue-admin-front

罗俭
2023-12-01

项目名称:vue-admin-front

作者:雷婷婷

简介:

利用vue+iViewUI+vue-router+nodejs实现后台管理系统的搭建。

前端使用iViewUI框架进行架构,后台使用express框架进行架构。

技术栈:

1)使用iViewUI框架,配置webpack.config.js文件,下载相关模块

2)后台nodejs中的express框架

3)MongoDB作为数据库

4)vue-quill-editor编辑器插件

5)安装mongoose pagination、mongoose-materialized等相关插件

6)vuex状态管理器

7)crypto-js/md5 对用户密码进行加密显示

8)mixins代码混合,减少代码量,提高工作效率

疑难问题:

1)点击table中复选框无法获取当前id

2)进行添加删除等操作时,列表不会刷新

3)表单提交时不确定是添加操作还是编辑操作

4)tree控件,点击当前树时获取不到id

5)如何跨页面取数据

6)mongoose多条删除

7)http请求里的then方法中的this指向发生了改变

解决方案:

1)利用on-selection-change事件获取当前元素

2)添加删除等操作后,重新进行http请求刷新列表

3)在添加时传一个id,http请求前判断一下是否有id,有就是添加,没有就是编辑

4)利用on-select-change事件获取当前元素

5)利用cookie存储数据

6)用remove方法,传一个数组或对象,如{_id:{$in:ids}},注意要将ids转为数组

7)使用es6箭头函数

Build Setup

# install dependencies

npm install安装插件包

# serve with hot reload at localhost:8080

npm run dev 项目启动

package.json中配置了:

"scripts": {

"dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",

"build": "cross-env NODE_ENV=production webpack --progress --hide-modules"

}

运行项目还能用

# build for production with minification

npm run build

 类似资料: