d2-admin基本使用

原文

1.在gitee里下载D2admin开源框架

2.在电脑中下载node.js

3.在项目中运行 npm install (下载该项目的依赖包）

环境配置
在.env中，VUE_APP_API=api地址（配置自己项目的API）

目录讲解

1、src：这里是我们要开发的目录，基本上要做的事情都在这个目录里。里面包含了几个目录及文件：
　　1）assets：资源目录，放置一些图片或者公共js、公共css。这里的资源会被webpack构建；
　　2）components：组件目录，我们写的组件就放在这个目录里面；
　　3）router：前端路由，我们需要配置的路由路径写在index.js里面；
　　4）App.vue：根组件；
　 5）main.js：入口js文件；
2、index.html：首页入口文件，可以添加一些 meta 信息等
3、package.json：npm包配置文件，定义了项目的npm脚本，依赖包等信息

封装接口
在src\store\modules\d2admin\modules\account.js中缓存uuid和token

登录的时候再取uid和token

之后再把路由拦截中的token改了

路由
D2Admin 路由设置文件在 d2-admin/src/router/routes.js。
d2-admin-master\src\menu\modules文件夹下放你新建的文件，
之后在d2-admin-master\src\menu\index.js中引用你新建的文件，index文件下面有文字注释，并把新建文件写在文字注释的下面
再在菜单路由（src\menu\index.js）中写新建的文件路由先引用在写

这样就可以新建自己想要的动态路由页面

菜单路由

权限

书写规范

1.一个组件下只能有一个并列的 div，以下写法是错误：

1.1　数据要写在 return 里面，而不是像文档那样子写，以下写法错误：

2.　在大结构块时，加入合适的注释标签，并保持良好的层级缩进：

<div>
<!-- “导入”组件 -->
<div>xxx
</div>
<!-- “导入”组件/ -->
<!-- 搜索框 -->
<div>xxx
</div>
<!-- 搜索框/ -->
</div>

3.import 放在最顶部，并省略掉 .js，.json 和 .vue 后缀（已在webpack的resolve.extensions中做了配置）
import mockData from '@/mockdata/userMock.js'

export 对象中属性定义顺序
name 当前模块名字
components 便于查找引用了哪些组件（单个换行，以,结尾）

components: {
norecord,
TimePicker,
},

data 记得是一个 function，保证每个实例可以维护一份被返回对象的独立的拷贝
computed 计算属性
watch 监听器
filters 过滤器
directives 指令
mixins 混入
methods 方法

登录页面
src\views\system\login\index.vue这个页面是登录页面

在登录页面中引用放接口的页面

输入框和表单之类的可以在element-ui中找，里面的代码可以直接用
切换页面可以用v-if

@click 点击事件
项目页面
样式参考https://element.eleme.cn/#/zh-CN（桌面端组件库）
里面的样式很全，可以自由组合。
中亿丰——邸坤

d2-admin基本使用相关推荐

初始 D2 Admin
1.安装D2 admin 输入:npm install -g @d2-admin/d2-admin-cli 2.创建D2 项目 ,可以选择简洁版或者完整版输入:d2 create 3.然后进入创建 ...
D2 Admin 关于主动关闭tab标签
D2 Admin 主动关闭tab标签因为是在新的页面进行提交编辑操作,提交完成得到成功信息后要关闭这个页面,记录下操作过程: 在要关闭的页面: import { mapState, mapActio ...
D2 Admin CLI 快速生成 D2 Admin项目
介绍 D2 Admin CLI 是一个基于 D2 Admin 的脚手架系统,可以快速生成 D2 Admin 项目. 安装使用npm npm install -g @d2-admin/d2-admin ...
D2 Admin 环境变量和模式
环境变量和模式概述: 可以替换项目根目录中的下列文件来指定环境变量: .env # 在所有的环境中被载入 .env.local # 在所有的环境中被载入,但会被 git 忽略 .env.[mode] ...
前端好用的框架及工具
Taro UI 介绍 Taro UI 是一款基于 Taro 框架开发的多端 UI 组件库. Taro 是由京东·凹凸实验室倾力打造的多端开发解决方案.现如今市面上端的形态多种多样,Web.Reac ...
我是如何让公司后台管理系统焕然一新的(上) -性能优化
在这个项目中你有遇到什么技术难点,你是怎么解决的? 其实这个问题旨在了解你在遇到问题的时候的解决方法,毕竟现在前端技术领域广,各种框架和组件库层出不穷,而业务需求上有时纷繁复杂,观察一个程序员在面对未 ...
组合数据类型——字典(dict)
字典声明 d1 = dict() #声明一个空字典d2 = {'key': 'value', 'key2': 'value2'} #声明一个非空字典数据操作---- 增加数据 1.key和valu ...
记一次开源学习--D2Admin 人人企业版
Created by huqi at 2019-5-5 13:01:14 Updated by huqi at 2019-5-20 15:57:37 前言上个月月底@D2开源组开源了使用 D2Ad ...
webrtc janus服务器调试工具 admin api 详解（二）调试janus看这一篇就够了！！
在上一篇发布的时候离现在已经过去不少的时间, 这段时间也一直处理这个问题, 最终解决了它,因为自己内容的原因,自己也走不了少的弯路,比如增加一些配置问题, coturn在测试网站是通的,但实际使用的 ...
Laravel Dcat Admin 安装
安装环境 PHP >= 7.1 Laravel 5.5.0 ~ 7.* Fileinfo PHP Extension 开始安装如果安装过程中出现 composer 下载过慢或安装失败的情况, ...

d2-admin基本使用

d2-admin基本使用相关推荐

最新文章

热门文章