- 博客(38)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 Vue角色的权限管理
根据服务器端的数据，对角色的权限管理使用for循环进行遍历，然后渲染了样式使用element-ui实现布局文章目录角色权限的样式角色权限分配权限分配角色功能的实现接口删除角色指定权限的接口所有权限列表接口角色授权 接口角色权限的样式先获取角色的 一级权限、二级权限、三级权限，然后分别对一级循环、二级权限、三级权限 进行循环下面是 一级权限、二级权限、三级权限 的 数据角色权限权限管理：[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0zpIKssV-
2021-01-31 23:38:37
2650
2
原创 Vue分页
下面是对分页功能的整理，希望可以帮助到有需要的小伙伴~文章目录分页样式分页方法分页样式分页样式是使用element-ui实现的，使用element-ui中的组件的时候要提前引用<!-- 分页区域 --> <!-- data() 的 queryInfo值 有 pagenum、pagesize 可以用来表示分页数据 // 当前的页数 pagenum: 1, // 当前每页显示多少条数据 pagesize: 2
2021-01-31 00:03:27
179
原创 Vue修改用户信息~不要错过哦
下面是对修改用户信息功能的整理，希望可以帮助到有需要的小伙伴~文章目录修改用户信息按钮的样式修改用户信息按钮的对话框修改用户信息所需的数据修改用户信息的方法接口根据 ID 查询用户信息编辑用户提交修改用户信息按钮的样式<!-- 修改按钮 --><!-- scope.row 获取到 改行 的所有数据 --><!-- scope.row.id 获取到 改行 的数据中的id --><el-button type="primary" icon="el
2021-01-30 23:46:23
4070
原创 Vue编写添加用户的表单 ~ 不要错过哦
在写项目的过程中遇到了添加用户信息的功能，今天写出来和大家分享。希望可以帮助到有需要的小伙伴文章目录使用element-ui实现布局和样式javascript中的数据、数据的校验规则 以及 方法添加用户的接口使用element-ui实现布局和样式在使用element-ui的时候，要引入需要使用的ui组件并注册后，才可以使用添加用户的按钮添加用户的表单 – 使用对话框实现点击添加按钮后会出现这个添加用户的表单<!--添加用户的按钮--><!-- addDialogVis
2021-01-30 11:59:02
1006
2
原创 Error: ER_ACCESS_DENIED_ERROR: Access denied for user ‘root‘@‘localhost‘ (using password: YES)解决办法
在写Vue项目的过程中，遇到报错：Error: ER_ACCESS_DENIED_ERROR: Access denied for user ‘root’@‘localhost’ (using password: YES)困扰了小编好几天。在服务器文件夹中的config文件夹中，找到default.json文件经过解决，发现是数据库3306的端口号被4302端口号占用了，杀掉4302端口号就可以了。下面以杀死 14706端口为例，向大家介绍。14706端口 占用了 8080 端口杀掉端口号的
2021-01-29 16:32:56
2611
1
原创 插槽作用域渲染按钮开关 ~ 满满的干货哦
在一个项目中，经常会用到开关，我们就需要渲染开关。今天小编总结了以下具体的步骤，希望可以帮助到有需要的小伙伴~文章目录渲染开关的状态通过element-ui实现按钮的样式渲染按钮的步骤渲染开关的状态使用作用域插槽实现开关通过element-ui实现按钮的样式Switch开关：https://element.eleme.cn/#/zh-CN/component/switch渲染按钮的步骤定义一个作用域插槽，接收当前作用域的数据通过 v-model 双向数据绑定，将 数据 和 开关的
2021-01-28 20:43:01
209
原创 Vue实现可折叠导航菜单~非常详细
通过Vue编写一个二级，并且是可以折叠的导航菜单文章目录思路在main.js中 配置axios导入element样式Home.vue实现静态页面、样式及功能思路在侧边栏区域只写了一个二级导航，通过axios获取到侧边栏的数据，通过v-fot循环渲染该数据，形成多个二级菜单使用elemen-ui进行样式的设置在main.js中 配置axios导入axios包配置请求的根路径把axios包挂载到vue原型对象上：这样每一个vue组件都可以通过this直接访问到$http，从而去发起ajax请求
2021-01-27 22:29:59
3867
原创 Vue前端路由~非常详细哦，不要错过
下面是对Vue前端路由的整理，希望可以帮助到有需要的小伙伴~文章目录目标目录路由的基本概念与原理路由后端路由SPA(Single Page Application)前端路由实现简易前端路由Vue Routervue-router的基本使用基本使用步骤路由重定向vue-router嵌套路由嵌套路由用法父路由组件模板子级路由模板嵌套路由配置vue-router动态路由匹配动态匹配路由的基本用法路由组件传递参数props的值为布尔类型 （只接收动态数据）props的值为对象类型：（问题：可以接收props对象里
2021-01-26 19:44:13
327
原创 Vue前后端交互~非常详细哦~
目标能够说出什么是前后端交互模式能够说出Promise的相关概念和用法能够使用fetch进行接口调用能够使用axios进行接口调用能够使用async/await方式调用接口能够基于后台接口实现案例目录前后端交互模式Promise用法接口调用-fetch用法接口调用-axios用法接口调用async/await用法基于接口的案例前后端交互模式接口调用方式原生Ajax基于jQuery的Ajaxfetch （API）axios （第三方库）URL地址格式传
2021-01-25 21:28:42
7361
1
原创 git推送代码的命令详解
拉去推送代码的命令形式与操作形式是有一一对应关系的，下面根小编一起来看看~将本地代码推送到本地仓库git add .这个命令相当于：提交代码git commit -m "给你提交的代码起一个名字"这个命令相当于：3. 将本地仓库和远程仓库建立链接，便于推送git remote add origin https://gitee.com/cute_and_dada/vue_shop.git将本地仓库的代码推送到远程仓库 git push -u origin master
2021-01-25 08:26:05
3777
原创 Vue组件化开发 - 非常详细，不要错过哦~
源码示例链接：https://pan.baidu.com/s/1NEYDmLl2K7nNa-AKWtJqVA提取码：2c7a目标能够知道组件化开发思想能够知道组件的注册方式能够说出组件间的数据交互方式能够说出组件插槽的用法能够说出Vue调试工具的用法能够基于组件的方式实现业务功能组件化开发思想现实中的组件化思想体现标准分治重用组合编程中的组件化思想体现组件化规范: Web Components（有的浏览器不支持）我们希望尽可能多的重用代码自定义组件
2021-01-24 22:44:52
125
原创 Vue常用特性~非常详细哦，带源码资料
下面是对Vue常用特性的整理，希望可以帮助到有需要的小伙伴~源码资料：链接：https://pan.baidu.com/s/14rRYtUfXkO6mxUtCh4FCcA 提取码：e0sw文章目录Vue常用特性常用特性概览表单操作表单域修饰符自定义指令为何需要自定义指令自定义指令的语法规则（获取元素焦点)带参数的自定义指令（改变元素背景色)局部指令计算属性为何需要计算属性计算属性的用法计算属性与方法的区别侦听器侦听器的应用场景侦听器的用法过滤器过滤器的作用自定义过滤器过滤器的使用局部过滤器带参数的过
2021-01-23 22:51:54
85
原创 Error: Cannot find module ‘webpack-cli/bin/config-yargs‘ 解决办法
在webpack配置自动打包功能的时候，执行打包命令npm run dev报错：Error: Cannot find module ‘webpack-cli/bin/config-yargs’解决办法：删除node_modules文件夹在终端输入 npm install执行打包命令：npm run dev在浏览器中打开网址 http://localhost:8080/，找到文件打开运行即可...
2021-01-23 16:54:06
192
原创 Vue分支循环结构~非常详细哦
文章目录分支循环结构分支结构v-if与v-show的区别循环结构分支循环结构分支结构v-ifv-elsev-else-ifv-show：v-show的原理:控制元素样式是否显示display : none示例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=
2021-01-22 21:26:59
183
原创 Vue前后端交互实现图书管理功能
源码链接：https://pan.baidu.com/s/1MzN9Jcrz-OLv7GVklK7UXQ 提取码：36qe初始化项目：npm init -y安装相应的第三方模块：npm install express --savenpm install body-parser --save在浏览器中输入 http://localhost:3000/books.html 来执行文件文章目录案例效果案例分析接口文档：获取图书列表数据添加图书-提交图书信息编辑图书-根据ID查询图书信息编辑图
2021-01-22 10:17:20
456
原创 Vue样式绑定~非常详细哦
下面是对Vue样式绑定的整理，希望可以帮助到有需要的小伙伴~文章目录样式绑定class样式处理样式绑定语法细节style样式处理样式绑定class样式处理对象语法<div v-bind: class="{ active: isActive }"></div>数组语法<div v-bind: class="[activeclass, errorclass]"></div><!DOCTYPE html><html
2021-01-21 23:46:16
72
原创 Vue属性绑定~非常详细
下面是对Vue属性绑定的整理，希望可以帮助到有需要的小伙伴~属性绑定Vue如何动态处理属性v-bind指令用法<a v-bind : href='url'>跳转</ a>缩写形式<a : href="ur1">跳转</ a>示例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <
2021-01-21 23:43:29
1390
原创 Vue调试工具的安装方法（动动鼠标就完成，不会意外报错，超爽~）
Vue调试工具的安装方法1. 打开谷歌浏览器的网上应用商店并搜索谷歌浏览器的网上应用商店https://chrome.google.com/webstore/category/extensions2. 点击你要安装的插件3. 把插件安装到浏览器4. 打开管理扩展程序右键Vue的图标，打开该插件的“ 管理扩展程序 ”5. 允许访问文件网址6. 重启浏览器end~好啦，结束啦，觉得有帮助的小伙伴记得点赞收藏哦~...
2021-01-19 21:02:21
109
1
原创 npm 报错cb.apply is not a function
npm 报错cb.apply is not a function的解决办法：按照这个目录C:\Users(your username)\AppData\Roaming可以Win + r 输入 %appdata%步骤一：找到npm cache文件夹并删除,在cmd下运行npm clean cache —force步骤二：找到npm文件夹并删除，在cmd下运行：npm clean cache —force...
2021-01-19 14:06:08
6448
6
原创 Vue事件绑定（非常详细哦~）
下面是对Vue中事件绑定的整理，希望可以帮助到有需要的小伙伴~事件绑定vue如何处理事件v-on指令用法<input type= ‘button”v-on:click="num++'/>v-on简写形式<input type= ‘button'@click='num++/>事件函数的调用方式直接绑定函数名称<button v-on :click（事件类型）='say（方法名）'>Hello</button>
2021-01-19 08:16:44
3343
原创 Vue双向数据绑定 ~ 非常详细哦
Vue的双向数据绑定可以帮助我们更好的实现底层数据与页面数据的交互。下面是对Vue的双向数据绑定的具体整理，希望可以帮助到有需要的小伙伴~双向数据绑定什么是双向数据绑定实现交互用户在页面中改变后内容，代码中的数据会发生变化代码中的数据被改变后，页面中的内容会跟着发生变化双向数据绑定分析v-model指令用法<input type="text" v-model="uname" />示例：<!DOCTYPE html><html
2021-01-17 20:50:17
89
原创 Vue基本指令（详细，好理解，示例代码）
Vue指令可以帮助我们更好的实现交互功能。下面是对Vue的基本指令的整理，希望可以帮助到有需要的小伙伴~文章目录指令什么是指令v-clock指令用法数据绑定指令数据响应式指令什么是指令指令的本质是自定义属性指令的格式：以v-开始（比如：v-clock）v-clock指令用法插值表达式存在的问题︰“闪动”。如果浏览器比较卡的话，插值表达式的内容在浏览器中会出现“闪退”现象，会出现插值表达式。Vue的原理：先把插值表达式先放在页面上，然后再用数据替换如何解决该问题∶使用v-clo
2021-01-16 11:14:51
157
原创 vue的介绍及基本使用（详细，好理解，示例代码）
下面是对Vue的介绍和对Vue的基本使用，希望可以帮助到有需要的小伙伴~文章目录VUE介绍Vue：渐进式JavaScript框架Vue的基本使用Vue的基本使用步骤VUE介绍Vue是一套用于构建用户界面的渐进式框架。Vue被设计为可以自底向上逐层应用。Vie的核心库只关注视图层，不仅易于上手，而且便于与第三方库或既有项目整合。当Vue与现代化的工具链以及各种支持类库结合使用的时候，Vue完全能够为复杂的单页应用提供驱动。Vue.js的创建者是 尤雨溪2014年2月，Vue.js正式发布201
2021-01-15 22:45:45
671
原创 密码加密模块 bcrypt （详细，好理解，示例源码）
bcrypt模块可以对密码进行加密，下面是对bcrypt模块的整理，希望可以帮助到有需要的小伙伴~bcrypt依赖的其他环境python 2.x把python2.7添加到环境变量中重新以【管理员】身份打开命令行工具，输入以下2条命令node-gypnpm install -g node-gypwindows-build-toolsnpm install --global --production windows-build-tools重新打开命令行工具，安装加密：
2021-01-14 21:49:45
673
原创 模板继承（详细）
下面是对模板继承的整理，希望可以帮助到有需要的小伙伴~使用模板继承可以将网站HTML骨架抽离到单独的文件中，其他页面模板可以继承模板文件示例：html骨架：layout.art<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale
2021-01-13 22:46:07
551
原创 MongoDB更新文档（非常详细，不要错过~）
下面是对MongoDB更新数据库的整理，希望可以帮助到有需要的小伙伴~文章目录更新文档更新单个文档更新多个文档更新文档更新单个文档语法：User.updateOne({查询条件},{要修改的值}).then(result => console.log(result));如果与条件匹配的有多个文档，就更新第一个匹配的文档更新单个文档的示例：const mongoose = require('mongoose');// 对于没有创建的数据库，会自动创建一个数据库mongoose.c
2021-01-13 01:27:45
2841
原创 MongoDB删除文档（非常详细~）
当我们向数据库中导入数据后，有时候需要删除数据。下面是对MongoDB数据库中删除文档的整理，希望可以帮助到有需要的小伙伴~文章目录删除文档findOneAndDelete方法 - 删除一条文档deleteMany方法 - 删除多条文档删除文档findOneAndDelete方法 - 删除一条文档查找到一条文档并且删除返回结果是你删除的文档如果查询条件匹配了多个文档，将会删除第一个匹配的文档示例：const mongoose = require('mongoose');// 对于没有创建
2021-01-11 20:42:55
1532
1
原创 安装谷歌插件 ~ 一招轻松解决
在安装谷歌插件的时候，由于网络原因经常失败。今天和大家分享如何在本地安装谷歌插件，希望可以帮助到有需要的小伙伴~赶快跟小编一起来看看吧第一步：由于谷歌浏览器的插件默认是不能在本地安装的，我们需要 在谷歌网页中输入这个连接：chrome://flags/#extensions-on-chrome-urls进入下面这个页面设置一下，把第一栏（即 黄色的部分改为 “ Enable ”）第二步：在百度中搜索你要安装的插件名称并下载插件的压缩包（下载后解压）第三步：把下载好的文件拖到这个页面中即可
2021-01-10 20:48:35
158
原创 MongoDB查询文档（非常详细，不要错过哦~）
下面是在MongoDB中查询数据的操作的详细整理，希望可以帮助到有需要的小伙伴~条件查询的前提条件是创建一个数据库，创建集合规则，创建文档、插入数据。根据条件查询文档查询大于小于（在一定数组范围）的数据注意：一定要把大于小于的数据改成数字类型User.find({age:{$gt:20,$lt:50}}).then(result => console.log(result))实例：const mongoose = require('mongoose');// 对于没有创建的数据
2021-01-09 21:38:25
1402
1
原创 MongoDB数据库导入数据（非常详细）
前面的博客已经完成了数据库环境搭建、创建集合和创建文档，现在下面是对MongoDB导入数据库的详细介绍，希望可以帮助到有需要的小伙伴~把大量数据导入数据库中：mongoimport -d 数据库名称 -c 集合名称 -file 要导入的数据文件找到mongodb数据库的安装目录，将安装目录下的bin目录放置在环境变量中。如果bin目录里面少.exe文件，下面的链接里有bin目录下的所有.exe文件，下载然后复制到bin目录下就可以了链接https://www.mongodb.com/try/do
2021-01-08 21:12:32
14040
3
原创 MongoDB创建集合及创建文档（非常详细哦~）
创建集合类似于设置数据的类型，创建文档（有2种方式）即向创建的集合中插入数据下面是对创建集合和创建文档的详细介绍，希望可以帮助到有需要的小伙伴文章目录创建集合创建文档1创建文档2创建集合创建集合分为两步对集合设定规则创建集合创建mongoose.Schema构造函数的实例即可创建集合。const mongoose = require('mongoose');// 对于没有创建的数据库，会自动创建一个数据库mongoose.connect('mongodb://localhost/pl
2021-01-07 20:40:13
2245
原创 我与CSDN的2020年
2020年快要结束了，回想这一年，有付出、有回报。我是从2020年开始写博客的，那个时候我带着满满的好奇心和激动的心情写了第一篇博客，我生疏的但小心翼翼的编辑着自己的博客，第一天发布自己的博客，我第二天就回去看自己的访问量，看到有几个访问量我就特别开心。后来，我开始看别人写的博客，访问量那么高，而且有那么多的评论留言，我真的好羡慕。我就认真的读别人写的博客，真是写得太好了。我不断地学习别人是怎么写博客的，我开始注意笔记的样式，怎么样才能让别人一看就知道你写的是什么，怎么样写内容才会更加简洁……慢慢的我
2021-01-06 20:48:26
92
2
原创 MongoDB数据库的介绍和连接（非常详细、易懂）
下面是对MongoDB数据库的详细介绍、环境搭建和数据库的连接，希望可以帮助到有需要的小伙伴~文章目录MongoDB数据库介绍为什么要使用数据库什么是数据库MongoDB的环境搭建MongoDB数据库下载安装MongoDB可视化工具数据库相关概念Mongoose第三方包启动MongoDB数据库连接创建数据库MongoDB数据库介绍为什么要使用数据库动态网站（同一个网站，请求时传递的参数不同，有不同的结果）中的数据都是存储在数据库中的数据库可以用来持久存储客户端通过表单收集的用户信息数据库可以用
2021-01-06 20:36:11
1691
1
原创 express-art-template模板引擎（详细）
express-art-template模板引擎可以让art-template模板引擎更好的和Express框架配合，下面是对express-art-template模板引擎的整理，希望可以帮助到有需要的小伙伴~express-art-template模板引擎模板引擎为了使art-template模板引擎能够更好的和Express框架配合，模板引擎官方在原art-template模板引擎的基础上封装了express-art-template.使用npm install art-template e
2021-01-05 20:08:25
2723
原创 Express框架的请求处理~非常详细
下面是对Express请求处理的整理，希望可以帮助到有需要的小伙伴~文章目录Express请求处理构建模块化路由GET参数的获取POST参数的获取app.use()方法Express路由参数静态资源的处理Express请求处理构建模块化路由一个网站会需要很多的路由，为了方便可以使用模块化路由创建路由对象将路由和请求路径进行匹配具体处理请求下面是基础代码：// 引入express框架const express = require('express');// 创建服务器网站const
2021-01-04 22:36:07
582
1
原创 Express中间件（非常详细）
下面是对Express框架中间件的处理，希望可以帮助到有需要的小伙伴~中间件什么是中间件中间件就是一堆方法，可以接收客户端发来的请求可以对请求做出响应也可以将请求继续交给下一个中间件继续处理。中间件主要由两部分构成，中间件方法以及请求处理函数。中间件方法由Express提供，负责拦截请求，请求处理函数由开发人员提供，负责处理请求。app.get('请求路径','处理函数') // 接收并处理get请求app.post('请求路径','处理函数') // 接收并处理post请求可以针
2021-01-03 21:21:38
1998
原创 Express框架简介（详细）
下面是对Express框架的简单介绍，希望可以帮助到有需要的小伙伴~Express框架是什么Express是一个基于Node平台的web应用开发框架，它提供了一系列的强大特性，帮助你创建各种Web应用。可以使用npm install express命令进行下载。Express框架特性提供了方便简洁的路由定义方式对获取HTTP请求参数进行了简化处理对模板引擎支持程度高，方便渲染动态HTML页面提供了中间件机制有效控制HTTP请求拥有大量第三方中间件对功能进行扩展express入门实例：
2021-01-02 23:00:50
2116
1
原创 Node.js异步编程~超级详细哦
下面是对Node.js异步编程的整理，希望可以帮助到有需要的小伙伴~文章目录同步API，异步API同步API，异步API的区别获取返回值的方式不同代码执行顺序不同Node.js中的异步APIPromise通过Promise解决回调地狱异步函数同步API，异步API同步API：只有当API执行完成后，才能继续执行下一个API异步API：当前API的执行不会阻塞后续代码的执行// 同步编程/* console.log("before");console.log("after"); // bef
2021-01-02 00:20:11
933
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人