From de7d3d47d324668ec0eef3d7eea4be4874d406ac Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Thu, 8 Jul 2021 15:37:19 +0800 Subject: [PATCH 01/16] =?UTF-8?q?20210708=E7=AC=94=E8=AE=B0de=E7=AC=AC?= =?UTF-8?q?=E4=BA=8C=E6=AC=A1=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...ote-000-00-00-\345\205\266\345\256\203.md" | 10 +- .../note-2021-07-06-001.md" | 7 +- .../note-2021-07-08-001.md" | 176 ++++++++++++++++++ 3 files changed, 190 insertions(+), 3 deletions(-) diff --git "a/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" "b/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" index 672a95a..e4578a9 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" @@ -19,4 +19,12 @@ ``` ``` -# [git回到之前的某一个提交版本]https://blog.csdn.net/qq_30669833/article/details/105422803 \ No newline at end of file +# [git回到之前的某一个提交版本]https://blog.csdn.net/qq_30669833/article/details/105422803 + +## 今日份想问的点 +``` +在做审计日志的时候[Authorize]一定要关闭吗 + +在新增用户的时候为了查看是否生成 使用[AllowAnonymous]可以吗 + +``` \ No newline at end of file diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-06-001.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-06-001.md" index 05f8a1e..cad3839 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-2021-07-06-001.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-06-001.md" @@ -1,9 +1,11 @@ # 滂沱大雨 -## 克隆项目之后 需要记住（做）的三步骤 +## 克隆项目之后 需要记住（做）的四步骤 ``` 开服务 : 开启数据库服务 +修复 ：dotnet restore + 装工具 ：dotnet tool install --global dotnet-ef 更新数据库: dotnet ef database update (需要进入到项目中) @@ -130,7 +132,8 @@ namespace Admin3000.Backend.Api.Params }; } - var token = TokenHelper.GenerateToekn(_tokenParameter, username); + var user = _usersRepository.Table.Where(x => x.Username == username).FirstOrDefault(); + var token = TokenHelper.GenerateToekn(_tokenParameter, user); var refreshToken = "112358"; diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-08-001.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-08-001.md" index 2a7b421..0ae719a 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-2021-07-08-001.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-08-001.md" @@ -82,3 +82,179 @@ namespace Admin3000.Backend.Api.Entity 该内容为实现审计日志功能主要逻辑，通过过滤器获取当前执行控制器、方法判断是否需要记录审计日志； 其他请求参数、客户端ip等相关基本信息组成审计日志对象，并记录调用时间。　 ``` ++ 在项目中添加Filters文件夹并新建文件AuditLogActionFilter.cs +``` + +using System; +using System.Diagnostics; +using System.Reflection; +using System.Threading.Tasks; +using Admin3000.Backend.Api.Entity; +using Admin3000.Backend.Api.Repository; +using Microsoft.AspNetCore.Http; +using Microsoft.AspNetCore.Mvc; +using Microsoft.AspNetCore.Mvc.Controllers; +using Microsoft.AspNetCore.Mvc.Filters; +using Microsoft.Extensions.Logging; +using Newtonsoft.Json; + +namespace Admin3000.Backend.Api.Filters +{ + public class AuditLogActionFilter : IAsyncActionFilter + { + /// + /// 登录用户 + /// + // private readonly ISession _Session; + /// + /// 日志记录 + /// + private readonly ILogger _logger; + private readonly IRepository _auditLogService; + + public AuditLogActionFilter( + // ISession Session, + ILogger logger, + IRepository auditLogService + + ) + { + // _Session = Session; + _logger = logger; + _auditLogService=auditLogService; + } + + public async Task OnActionExecutionAsync(ActionExecutingContext context, ActionExecutionDelegate next) + { + // 判断是否写日志 + if (!ShouldSaveAudit(context)) + { + await next(); + return; + } + //接口Type + var type = (context.ActionDescriptor as ControllerActionDescriptor).ControllerTypeInfo.AsType(); + //方法信息 + var method = (context.ActionDescriptor as ControllerActionDescriptor).MethodInfo; + //方法参数 + var arguments = context.ActionArguments; + //开始计时 + var stopwatch = Stopwatch.StartNew(); + var auditInfo = new AuditInfo + { + // UserInfo = _Session?.Id, + UserInfo = 1.ToString(), + ServiceName = type != null ? type.FullName : "", + MethodName = method.Name, + ////请求参数转Json + Parameters = JsonConvert.SerializeObject(arguments), + ExecutionTime = DateTime.Now, + BrowserInfo = context.HttpContext.Request.Headers["User-Agent"].ToString(), + ClientIpAddress = context.HttpContext.Connection.RemoteIpAddress.ToString(), + //ClientName = _clientInfoProvider.ComputerName.TruncateWithPostfix(EntityDefault.FieldsLength100), + // Id = Guid.NewGuid().ToString() + }; + + ActionExecutedContext result = null; + try + { + result = await next(); + if (result.Exception != null && !result.ExceptionHandled) + { + auditInfo.Exception = result.Exception.ToString(); + } + } + catch (Exception ex) + { + auditInfo.Exception = ex.ToString(); + throw; + } + finally + { + stopwatch.Stop(); + auditInfo.ExecutionDuration = Convert.ToInt32(stopwatch.Elapsed.TotalMilliseconds); + + if (result != null) + { + switch (result.Result) + { + case ObjectResult objectResult: + auditInfo.ReturnValue = JsonConvert.SerializeObject(objectResult.Value); + break; + + case JsonResult jsonResult: + auditInfo.ReturnValue = JsonConvert.SerializeObject(jsonResult.Value); + break; + + case ContentResult contentResult: + auditInfo.ReturnValue = contentResult.Content; + break; + } + } + Console.WriteLine(auditInfo.ToString()); + //保存审计日志 + await _auditLogService.InsertAsync(auditInfo); + } + } + + /// + /// 是否需要记录审计 + /// + /// + /// + private bool ShouldSaveAudit(ActionExecutingContext context) + { + if (!(context.ActionDescriptor is ControllerActionDescriptor)) + return false; + var methodInfo = (context.ActionDescriptor as ControllerActionDescriptor).MethodInfo; + + if (methodInfo == null) + { + return false; + } + + if (!methodInfo.IsPublic) + { + return false; + } + + // if (methodInfo.GetCustomAttribute() != null) + // { + // return true; + // } + + // if (methodInfo.GetCustomAttribute() != null) + // { + // return false; + // } + + // var classType = methodInfo.DeclaringType; + // if (classType != null) + // { + // if (classType.GetTypeInfo().GetCustomAttribute() != null) + // { + // return true; + // } + + // if (classType.GetTypeInfo().GetCustomAttribute() != null) + // { + // return false; + // } + // } + return true; + } + + } +} +``` +#### 注册过滤器 ++ 在Startup.cs中 将services.AddControllers()修改为以下形式 +``` + services.AddControllers(options => + { + options.Filters.Add(typeof(AuditLogActionFilter)); + }); + +``` ++ 去 .http 文件中操作几下 ++ 最后去数据库中查看AuditInfo相关的表 有数据就证明成功了 \ No newline at end of file -- Gitee From cd591034bdbca2fe217abd404815d95c317b102a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Thu, 8 Jul 2021 17:32:20 +0800 Subject: [PATCH 02/16] =?UTF-8?q?20210708=E7=AC=94=E8=AE=B0de=E7=AC=AC?= =?UTF-8?q?=E4=B8=89=E6=AC=A1=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-000-00-00-\345\205\266\345\256\203.md" | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git "a/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" "b/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" index e4578a9..7a73a91 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" @@ -27,4 +27,12 @@ 在新增用户的时候为了查看是否生成 使用[AllowAnonymous]可以吗 -``` \ No newline at end of file +``` + +## 种子数据 +https://docs.microsoft.com/zh-cn/ef/core/modeling/data-seeding + +https://blog.csdn.net/weixin_30666943/article/details/95914969 + +https://blog.csdn.net/weixin_41372626/article/details/105312765 + -- Gitee From f9ef297915c0cf20549780d8e11dce12584f197f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Fri, 9 Jul 2021 11:30:16 +0800 Subject: [PATCH 03/16] =?UTF-8?q?20210709=E7=AC=94=E8=AE=B0de=E7=AC=AC?= =?UTF-8?q?=E4=B8=80=E6=AC=A1=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-2021-07-09-001.md" | 32 +++++++++++++++++++ 1 file changed, 32 insertions(+) create mode 100644 "\345\210\230\345\256\211\347\246\217/note-2021-07-09-001.md" diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-09-001.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-001.md" new file mode 100644 index 0000000..6f1daa4 --- /dev/null +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-001.md" @@ -0,0 +1,32 @@ +# [添加种子数据](https://docs.microsoft.com/zh-cn/ef/core/modeling/data-seeding) +### [git文档](https://gitee.com/mirrors_dotnet/EntityFramework.Docs/tree/main/samples/core/Modeling/DataSeeding) + +#### 在数据库上下文中添加一个初始化逻辑 ++ 也就是Admin3000Db.cs文件中 +``` + public DbSet Users { get; set; } //这行如果之前有可以不用 + protected override void OnModelCreating(ModelBuilder modelBuilder) + { + //以下就是添加的种子数据（根据你添加的表的字段来）注： Id虽然设置是自增长但是在初始化的时候还是要赋值上去 + modelBuilder.Entity().HasData( + new Users + { + Id = 1, + Username = "admin", + Password="113", + IsActived=true, + IsDeleted=false, + CreatedTime=DateTime.Now, + UpdatedTime=DateTime.Now, + Remarks="种子数据", + DisplayOrder=0 + + }); + } +``` ++ 使用数据迁移和数据更新 +``` + dotnet ef migrations add 添加种子数据 + dotnet ef database update +``` ++ 最后去数据库查看就生成了种子数据 -- Gitee From 44852c9efafed5bf4623c1d6ba7fc23dd9033343 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Fri, 9 Jul 2021 14:56:46 +0800 Subject: [PATCH 04/16] =?UTF-8?q?20210709=E7=AC=94=E8=AE=B0de=E7=AC=AC?= =?UTF-8?q?=E4=B8=89=E6=AC=A1=E6=8F=90=E4=BA=A4-=E4=BF=AE=E6=94=B9?= =?UTF-8?q?=E7=A7=8D=E5=AD=90=E6=95=B0=E6=8D=AE=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-2021-07-09-001.md" | 41 +++++++++++++------ 1 file changed, 28 insertions(+), 13 deletions(-) diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-09-001.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-001.md" index 6f1daa4..ce4ad53 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-2021-07-09-001.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-001.md" @@ -1,32 +1,47 @@ -# [添加种子数据](https://docs.microsoft.com/zh-cn/ef/core/modeling/data-seeding) -### [git文档](https://gitee.com/mirrors_dotnet/EntityFramework.Docs/tree/main/samples/core/Modeling/DataSeeding) +# [添加种子数据配合文档食用更香](https://docs.microsoft.com/zh-cn/ef/core/modeling/data-seeding) + +### [git 文档](https://gitee.com/mirrors_dotnet/EntityFramework.Docs/tree/main/samples/core/Modeling/DataSeeding) #### 在数据库上下文中添加一个初始化逻辑 -+ 也就是Admin3000Db.cs文件中 + +- 也就是 Admin3000Db.cs 文件中 + ``` + public DbSet Users { get; set; } //这行如果之前有可以不用 + protected override void OnModelCreating(ModelBuilder modelBuilder) { - //以下就是添加的种子数据（根据你添加的表的字段来）注： Id虽然设置是自增长但是在初始化的时候还是要赋值上去 + modelBuilder.Entity(entity => { entity.Property(e => e.Username).IsRequired(); }); + + //以下就是添加的种子数据（根据你添加的表的字段来）注： Id虽然设置是自增长但是在初始化的时候还是要赋值上去 + + #region UsersSeed //#region+#endregion 该段内容可折叠 modelBuilder.Entity().HasData( new Users { Id = 1, Username = "admin", - Password="113", - IsActived=true, - IsDeleted=false, - CreatedTime=DateTime.Now, - UpdatedTime=DateTime.Now, - Remarks="种子数据", - DisplayOrder=0 + Password = "113", + IsActived = true, + IsDeleted = false, + CreatedTime = DateTime.Now, + UpdatedTime = DateTime.Now, + Remarks = "种子数据", + DisplayOrder = 0 }); + #endregion + } + ``` -+ 使用数据迁移和数据更新 + +- 使用数据迁移和数据更新 + ``` dotnet ef migrations add 添加种子数据 dotnet ef database update ``` -+ 最后去数据库查看就生成了种子数据 + +- 最后去数据库查看就生成了种子数据 -- Gitee From a2612c0ac53911b9dd39563a7e4e4976bd4ba31a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Fri, 9 Jul 2021 15:40:02 +0800 Subject: [PATCH 05/16] =?UTF-8?q?vue=E5=89=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-2021-07-09-002.md" | 30 +++++++++++++++++++ 1 file changed, 30 insertions(+) create mode 100644 "\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" new file mode 100644 index 0000000..8f65487 --- /dev/null +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" @@ -0,0 +1,30 @@ +# 安装Vue脚手架并且封装路由 +[可配合20210605笔记食用](./note-2021-06-08-001.md) +### 前置 ++ 1. 将npm的镜像替换成淘宝镜像 +``` +npm config set registry http://registry.npm.taobao.org +``` ++ 2. 安装yarn的包管理器 已经有了可以跳过 +``` +npm install -g yarn +``` ++ 3. 新建一个全小写的英文文件夹 +### 安装 ++ 使用npm安装和yarn安装都可以 区别是npm安装较慢； ++ yarn安装相对快 但是需要手动配置电脑的环境变量 +[如何配置yarn的环境变量](https://blog.csdn.net/wyf521995/article/details/102885887) +``` +npm install -g @vue/cli +# OR +yarn global add @vue/cli +``` ++ 安装完成之后 + - vue --version 出现vue版本号即安装成功 + - vue 出现vue的相关提示命令即可 +``` +vue --version +# OR +vue +``` + -- Gitee From eb861ec5ac921288e897a8c0bcd0fcc1029f6e86 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Fri, 9 Jul 2021 16:18:26 +0800 Subject: [PATCH 06/16] =?UTF-8?q?Vue=E9=A1=B9=E7=9B=AE=E5=88=9B=E5=BB=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-2021-07-09-002.md" | 27 ++++++++++++++++++- 1 file changed, 26 insertions(+), 1 deletion(-) diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" index 8f65487..d612377 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" @@ -27,4 +27,29 @@ vue --version # OR vue ``` - +### 创建一个项目 ++ xxx带表文件名要求全小写我这里是 admin3000.frontend +``` +vue create xxx +``` ++ 这边选择的是Vue2 所以默认就行 +``` +? Please pick a preset: (Use arrow keys) +> Default ([Vue 2] babel, eslint) + Default (Vue 3) ([Vue 3] babel, eslint) + Manually select features +``` ++ 选择包管理器 这里选用的是 yarn 包管理器 + - 当你有多个包管理器的时候 才会出现选择否则就是默认的包管理器 +``` +? Please pick a preset: Default ([Vue 2] babel, eslint) +? Pick the package manager to use when installing dependencies: (Use arrow keys) +> Use Yarn + Use NPM +``` +### 然后等待安装 ++ 当出现提示进入文件夹和运行时就成功了 +``` +$ cd admin3000.frontend +$ yarn serve +``` -- Gitee From e69ed42a0fe1fef3debb0541b319d4f4b2eb7475 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Fri, 9 Jul 2021 17:41:08 +0800 Subject: [PATCH 07/16] =?UTF-8?q?=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-2021-07-09-002.md" | 93 +++++++++++++++++++ 1 file changed, 93 insertions(+) diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" index d612377..2a1bc64 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" @@ -27,6 +27,7 @@ vue --version # OR vue ``` +-------- ### 创建一个项目 + xxx带表文件名要求全小写我这里是 admin3000.frontend ``` @@ -53,3 +54,95 @@ vue create xxx $ cd admin3000.frontend $ yarn serve ``` +------- +## 封装路由 ++ 首先添加路由 +``` +yarn add vue-router +``` ++ 1. 若成功package.json中的dependencies下会多一个 +``` + "vue-router": "^3.5.2" + +``` ++ 2. 若失败 [解决办法](https://blog.csdn.net/wmmhwj/article/details/64444593?locationnum=8&fps=1) + - error Received malformed response from registry for "vue-router". The registry may be down. +``` +npm config set registry https://registry.npm.taobao.org + +npm config set disturl https://npm.taobao.org/dist +``` ++ 装个插件 Vetur +------------ +#### 在main.js 中定义路由 +``` +import Vue from 'vue' +import App from './App.vue' +import VueRouter from 'vue-router' +import HelloWorld from './components/HelloWorld' + +Vue.config.productionTip = false + +let router = new VueRouter({ + mode: "history", + routes: [ + { + path: '/home',//请求路径 + component: HelloWorld//显示的内容 + }, + ], +}) + +new Vue({ + router, + render: (h) => h(App), +}).$mount('#app') + +``` +#### 在components中添加一个Home.vue ++ Home.js +``` + + + + + +``` + ++ 修改main.js中的路由为首页显示内容为Home +``` +import Vue from 'vue' +import App from './App.vue' +import VueRouter from 'vue-router' +// import HelloWorld from './components/HelloWorld' +import Home from './components/Home' + +Vue.config.productionTip = false + +let router = new VueRouter({ + mode: "history", + routes: [ + { + path: '/',//请求路径 + component: Home//显示的内容 + }, + ], +}) + +new Vue({ + router, + render: (h) => h(App), +}).$mount('#app') + +``` ++ 然后就可以 yarn serve 运行看效果了 \ No newline at end of file -- Gitee From 3406140d0cc67f5d64aab3b7bb0c598443bc3514 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Sat, 10 Jul 2021 10:47:07 +0800 Subject: [PATCH 08/16] =?UTF-8?q?20210710=E7=AC=94=E8=AE=B0de=E7=AC=AC?= =?UTF-8?q?=E4=B8=80=E6=AC=A1=E6=8F=90=E4=BA=A4-=E5=AE=8C=E6=88=90vue?= =?UTF-8?q?=E5=B0=81=E8=A3=85=E8=B7=AF=E7=94=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-2021-07-09-002.md" | 100 +++++++++++++++++- .../note-2021-07-10-001.md" | 0 2 files changed, 96 insertions(+), 4 deletions(-) create mode 100644 "\345\210\230\345\256\211\347\246\217/note-2021-07-10-001.md" diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" index 2a1bc64..742e15e 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-09-002.md" @@ -88,7 +88,7 @@ let router = new VueRouter({ routes: [ { path: '/home',//请求路径 - component: HelloWorld//显示的内容 + component: HelloWorld//加载组件 }, ], }) @@ -128,13 +128,13 @@ import VueRouter from 'vue-router' import Home from './components/Home' Vue.config.productionTip = false - +Vue.use(VueRouter) //千万记得要注册 let router = new VueRouter({ mode: "history", routes: [ { path: '/',//请求路径 - component: Home//显示的内容 + component: Home//加载组件 }, ], }) @@ -145,4 +145,96 @@ new Vue({ }).$mount('#app') ``` -+ 然后就可以 yarn serve 运行看效果了 \ No newline at end of file ++ 然后就可以 yarn serve 运行看效果了 + +### 开始封装 +- 在src文件夹下新建一个router的文件 + + 新建一个index.js的文件 在这里注册路由 + + 新建一个rotes.js的文件 在这里定义路由 +- index.js +``` +import Vue from "vue"; +import VueRouter from "vue-router"; +import routes from './routes' + +Vue.use(VueRouter) + +let router = new VueRouter({ + mode:"history", + routes +}) + +export default router +``` +- router.js +``` +//引入所需组件库 +import Vue from "vue"; +import VueRouter from "vue-router"; +import routes from './routes' + +//全局注册路由中间件 +Vue.use(VueRouter) + +//注册路由实例，并且提供路由的模式和路由定义 +let router = new VueRouter({ + mode:"history", + routes +}) + +//暴露路由实例 +export default router +``` ++ 在main.js中修改或引用封装的路由 即可 +``` +import Vue from 'vue' +import App from './App.vue' +import router from './router' + +Vue.config.productionTip = false + + +new Vue({ + router, + render: (h) => h(App), +}).$mount('#app') + +``` ++ 运行成功且显示和上次一样的页面就可以了 + +### 新添加路由 +- 此时添加路由只需要在routes.js中添加就可以了 + + 首先要去components文件夹中添加你的组件 + + 添加组件库 然后添加routes 例如我添加了一个Users + + 然后 yarn serve 运行 访问Users 就可以显示内容了 前提是你的组件里敲了内容 +``` +import Home from '../components/Home' + +import Users from '../components/Users'//这就是我添加的组件 +let routes = [ + { + path: '/',//请求路径 + component: Home//加载组件 + }, + { + path: '/users',//请求路径 + component: Users//加载组件 + } +] +export default routes +``` ++ 引用组件库的另一种方法 异步加载组件 + - 不需要import 直接写在component后面即可 +``` + component: ()=>import("../components/Users")//异步加载组件 + +``` + +## 失手 +``` + 记得注册路由 + Vue.use(VueRouter) + + mode:"history", history得加上引号 + +``` \ No newline at end of file diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-10-001.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-10-001.md" new file mode 100644 index 0000000..e69de29 -- Gitee From 3a58a2ff7daa110b0e670b10c3ec48da29c74735 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Sat, 10 Jul 2021 14:41:09 +0800 Subject: [PATCH 09/16] =?UTF-8?q?20210710=E7=AC=94=E8=AE=B0de=E6=8F=90?= =?UTF-8?q?=E4=BA=A4-=E4=BD=BF=E7=94=A8ElementUI?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...ote-000-00-00-\345\205\266\345\256\203.md" | 1 + .../note-2021-07-10-001.md" | 111 ++++++++++++++++++ 2 files changed, 112 insertions(+) diff --git "a/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" "b/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" index 7a73a91..ca4b50e 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" @@ -36,3 +36,4 @@ https://blog.csdn.net/weixin_30666943/article/details/95914969 https://blog.csdn.net/weixin_41372626/article/details/105312765 +## [添加、修改、删除、查看本地git的用户名和邮箱](https://blog.csdn.net/weixin_46652769/article/details/108028372?utm_term=git%E5%88%A0%E9%99%A4%E9%85%8D%E7%BD%AE%E7%9A%84%E7%94%A8%E6%88%B7%E5%92%8C%E9%82%AE%E7%AE%B1&utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2~all~sobaiduweb~default-2-108028372&spm=3001.4430) diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-10-001.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-10-001.md" index e69de29..c01445c 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-2021-07-10-001.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-10-001.md" @@ -0,0 +1,111 @@ +# 使用elementui 制作后端管理界面 +# [Elementui官方文档](https://element.eleme.io/#/zh-CN/component/installation) +### 安装 +``` +yarn add element-ui +``` ++ 然后再main.js中引入 +``` +import ElementUI from 'element-ui'; +import 'element-ui/lib/theme-chalk/index.css'; + +Vue.use(ElementUI) +``` +完整main.js +``` +import Vue from 'vue' +import App from './App.vue' +import router from './router' +import ElementUI from 'element-ui'; +import 'element-ui/lib/theme-chalk/index.css'; + +Vue.config.productionTip = false + +Vue.use(ElementUI) + + +new Vue({ + router, + render: (h) => h(App), +}).$mount('#app') + +``` ++ 在conponts注册一个Layout.vue + - 同时也要去routes里面去新添路由 + ++ routes.js +``` +import Home from '../components/Home' +import Users from '../components/Users' +import Layout from '../components/Layout' +let routes = [ + { + path: '/',//请求路径 + component: Home//显示的内容 + }, + { + path: '/users',//请求路径 + component: Users//显示的内容 + }, + { + path:'/layout', + component:Layout + } +] + +export default routes +``` ++ Layout.vue 我是从官方文档添加了一个[布局容器](https://element.eleme.io/#/zh-CN/component/container) +``` + + + + + +``` +# 剩下的就是从官方文档中完成自己的后台界面了 \ No newline at end of file -- Gitee From 90b35af91f19ee8dadf0d95ba264cb79fdf6e9bc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Wed, 14 Jul 2021 17:34:24 +0800 Subject: [PATCH 10/16] =?UTF-8?q?=E6=8F=90=E4=BA=A4=E4=BB=A5=E4=B8=80?= =?UTF-8?q?=E4=B8=8B=E7=AC=94=E8=AE=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-000-00-00-\345\205\266\345\256\203.md" | 4 ++++ 1 file changed, 4 insertions(+) diff --git "a/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" "b/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" index ca4b50e..c22fca6 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" @@ -37,3 +37,7 @@ https://blog.csdn.net/weixin_30666943/article/details/95914969 https://blog.csdn.net/weixin_41372626/article/details/105312765 ## [添加、修改、删除、查看本地git的用户名和邮箱](https://blog.csdn.net/weixin_46652769/article/details/108028372?utm_term=git%E5%88%A0%E9%99%A4%E9%85%8D%E7%BD%AE%E7%9A%84%E7%94%A8%E6%88%B7%E5%92%8C%E9%82%AE%E7%AE%B1&utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2~all~sobaiduweb~default-2-108028372&spm=3001.4430) + +## [配色表](http://tool.c7sky.com/webcolor/#character_6) +## [给你颜色](https://www.zhihu.com/question/46535237/answer/720174652) +## [90设计](http://90sheji.com/tupian/default/3.html?skid_3=30&page=7) \ No newline at end of file -- Gitee From 0ee393dcb0497cbeffe0f78144fa1a12e0388906 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Thu, 15 Jul 2021 17:41:01 +0800 Subject: [PATCH 11/16] =?UTF-8?q?=E6=8F=90=E4=BA=A4=E7=AC=94=E8=AE=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-000-00-00-\345\205\266\345\256\203.md" | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git "a/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" "b/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" index c22fca6..ca1b263 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-000-00-00-\345\205\266\345\256\203.md" @@ -40,4 +40,8 @@ https://blog.csdn.net/weixin_41372626/article/details/105312765 ## [配色表](http://tool.c7sky.com/webcolor/#character_6) ## [给你颜色](https://www.zhihu.com/question/46535237/answer/720174652) -## [90设计](http://90sheji.com/tupian/default/3.html?skid_3=30&page=7) \ No newline at end of file +## [90设计](http://90sheji.com/tupian/default/3.html?skid_3=30&page=7) + +## [设置图片旋转](https://www.w3school.com.cn/cssref/pr_animation.asp) +## [设置图片旋转](https://www.cnblogs.com/zhangcheng001/p/10949191.html) +## [设置图片旋转](https://blog.csdn.net/qq_23663693/article/details/108101145) \ No newline at end of file -- Gitee From b9a735a6d48ab9913cfc580158f1edb60c70989b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Fri, 16 Jul 2021 11:31:56 +0800 Subject: [PATCH 12/16] =?UTF-8?q?=E6=8F=90=E4=BA=A4=E4=BB=A5=E4=B8=8B?= =?UTF-8?q?=E7=AC=94=E8=AE=B0-vue=E5=9B=BE=E6=A0=87=E5=92=8C=E6=94=B6?= =?UTF-8?q?=E7=BC=A9=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-2021-07-16-001.md" | 90 +++++++++++++++++++ .../note-2021-07-16-002.md" | 1 + 2 files changed, 91 insertions(+) create mode 100644 "\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" create mode 100644 "\345\210\230\345\256\211\347\246\217/note-2021-07-16-002.md" diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" new file mode 100644 index 0000000..6645268 --- /dev/null +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" @@ -0,0 +1,90 @@ +# 柒月拾陸日 +## 白天有太阳据说会下雨 +------- + +# 重定向 +``` +redirect:{path:('/dashborad')}, +children: [ + { + path: 'dashborad',//请求路径 + component: ()=>import('../views/dashborad'),//显示的内容 + title:'仪表盘', + } +] +``` +# 改变左边图标风格 +- 添加一个本身的属性 +``` + meta:{ + title:'xxx', + icon:'xxx', + }, +``` +- NavbarItem.vue遍历meta.icon +# [收缩时隐藏文字](https://blog.csdn.net/pangji0417/article/details/93353327) +``` + +``` +----- +# [Echarts](https://echarts.apache.org/examples/zh/index.html) +## 在打包环境中使用 ECharts +``` +npm install echarts --save +# OR +yarn add echarts +``` +## 在main.js 中引入 +``` +import * as echarts from 'echarts'; + +Vue.prototype.$echarts = echarts//加载其所有组件 + +``` +## 在組件中使用 +``` + + + + + +``` \ No newline at end of file diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-16-002.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-16-002.md" new file mode 100644 index 0000000..4e768b5 --- /dev/null +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-16-002.md" @@ -0,0 +1 @@ +# \ No newline at end of file -- Gitee From 9f83ed6c8f530ce236f55f6848bc8107346fab20 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Fri, 16 Jul 2021 14:56:18 +0800 Subject: [PATCH 13/16] =?UTF-8?q?=E6=8F=90=E4=BA=A4=E7=AC=94=E8=AE=B0-?= =?UTF-8?q?=E9=9A=90=E8=97=8F=E6=94=B6=E7=BC=A9=E6=97=B6=E6=98=BE=E7=A4=BA?= =?UTF-8?q?=E5=87=BA=E6=9D=A5=E7=9A=84=E5=9B=BE=E6=A0=87?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../note-2021-07-16-001.md" | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" index 6645268..bac06a9 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" @@ -24,7 +24,16 @@ children: [ - NavbarItem.vue遍历meta.icon # [收缩时隐藏文字](https://blog.csdn.net/pangji0417/article/details/93353327) ``` - +#OR +/*隐藏文字*/ +.el-menu--collapse .el-submenu__title span{ + display: none; +} +/*隐藏 > */ +/* 通常是要自己去找到图标所在的class */ +i.el-submenu__icon-arrow.el-icon-arrow-right { + display: none; +} ``` ----- # [Echarts](https://echarts.apache.org/examples/zh/index.html) -- Gitee From 9e81d25b89ea02196ad780cac9461ed1b8dc47a7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=89=E7=A6=8F?= <1907917017@qq.com> Date: Fri, 16 Jul 2021 16:28:54 +0800 Subject: [PATCH 14/16] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=B7=A6=E8=BE=B9?= =?UTF-8?q?=E7=9A=84=E9=9A=90=E8=97=8F=E5=9B=BE=E6=A0=87=E7=9A=84class?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- "\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git "a/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" "b/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" index bac06a9..123a375 100644 --- "a/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" +++ "b/\345\210\230\345\256\211\347\246\217/note-2021-07-16-001.md" @@ -30,7 +30,7 @@ children: [ display: none; } /*隐藏 > */ -/* 通常是要自己去找到图标所在的class */ +/* 通常是要自己去找到图标所在的class 前提是