最近前后端分离大行其道，苦了后端人员，需要学习的东西还不少。于是到网上看了看前端的教程。没想到前端发展到今天变得如此复杂。前端也包括权限和路由的东西。不过整体看上去似曾相识，只是需要熟悉些新的语法。昨天晚上试用了一下element ui。感觉这个框架还是不错的。学了vue，再也不想用jQuery了。不再直接操作dom，而是跟数据打交道。今后打算好好学习下vue，网上做出来的后端框架还是不少的。下面
我们项目中有很多需要用到树形组件的，以前写jq的时候用ztree，现在写vue，感觉找不到像ztree一样好用的树形组件，又不想在vue总用jq，所以打算自己封装一个tree组件，花了两个时间才搞完一些基本功能，不过已经可以正常使用了，效果如下：图标的问题大家可以自行用ztree的样式去修改加上上周的折叠式菜单，gitHub网址：h
转载
2024-04-07 08:43:57
109阅读
目录一、Vue+Element ui1、Vue+Element ui1、show-overflow-tooltip属性设置宽度2、this.$refs使用方法3、vue前端debug4、vue前后端环境交互一、Vue+Element ui1、Vue+Element ui1、show-overflow-tooltip属性设置宽度:show-overflow-tooltip="true"，该属性可以让
转载
2024-09-23 20:54:07
86阅读
后台开发离不开权限，不同的用户登录，根据不同的权限，可以访问不同的管理目录。但在使用 vue-element-template 里内置的权限模块功能后，发现作者提供的权限模块扩展性不是很好，所以这篇文章就是记录我是如何基于作者原有的权限模块进行的一次重构。为什么要重构开篇的时候说了，因为扩展性不是很好，那具体是什么扩展性不好呢？我们先来看下作者原有的权限模块实现思路是怎么样的。
转载
2024-07-02 07:15:25
214阅读
首先你要有两个路由表 一个是不管什么角色都能访问的路由表，还有一个是需要控制判断权限才能访问的路由表公共路由表：export const routes = [{
path: '/',
name: '',
redirect: '/login',
component: Login
},
{
path: '/login',
name:
转载
2024-06-05 05:27:57
54阅读
vue中异步函数async和await的用法一，异步函数async1.1，async作为一个关键字放到函数前面，用于表示函数是一个异步函数，因为async就是异步的意思， 异步函数也就意味着该函数的执行不会阻塞后面代码的执行。 写一个async 函数。就是在函数前面加上async 关键字，来表示它是异步的，那怎么调用呢？async 函数也是函数，平时我们怎么使用函数就怎么使用。
转载
2024-04-09 11:53:13
193阅读
基于Element-UI的树形表格组件，根据需求扩展一些功能，如实现每次只能展开同级一行的手风琴效果，表格数据实现新增，编辑，查询，删除等。[一] 每次只能展开同级一行的手风琴效果<el-table
ref="table"
:data="tableData"
:tree-props="{children: 'children', hasChildren: 'ha
转载
2024-03-23 09:56:44
2346阅读
一、介绍：el-tree在element文档中有查询全树的代码，本文主要是在此基础上添加了增加、删除、修改的界面样式与功能。二、具体来说：1、鼠标移动到树上显示删除和修改： 点击删除，当前节点删除； 点击修改，树的选中节点变成input可以重新输入名称并且右边出现取消或确认的icon。2、点击底部添加按钮，如果未选中树
转载
2024-04-06 08:04:15
828阅读
本文主要讲述vue中的异步组件，如果你看完本文相信你应该对vue中的异步组件有着相对深刻的理解， 如果你还不知道vue中异步组件是什么为什么要异步组件异步组件是vue性能优化的一种方式，主要目的是为了解决页面引入很多组件导致打包后的js体积过大，我们知道同样条件下，文件体积越大，请求耗时越长，因此 vue提供了异步组件，当页面中通过异步方式来声明（全局）或者注册（局部）组件时，每个异步组件会被单独
转载
2024-03-07 12:40:42
45阅读
在 Vue 中，组件可以递归的调用本身，但是有一些条件：该组件一定要有 name要确保递归的调用有终止条件，防止内存溢出不知道大家有没遇到过这样的场景：渲染列表数据的时候，列表的子项还是列表。如果层级少尚且可以用几个for循环搞定，但是层级多或者层级不确定就有点无从下手了。其实这就是树形结构数据，像常见的例如导航、空间或逻辑组织、页面定位、级联选择等，其结构可展开或折叠，都属于这种结构。
转载
2023-12-14 06:09:57
395阅读
Vue中使用z-tree处理大数量的数据一、简介二、引入z-tree三、z-tree中的原生方法1、折叠和展开2、checkbox状态下的全选3、获取选中的节点四、结束语 一、简介效果展示：应用场景是这样的：后台给我返回的数据是处理好层级的数据，包含关系是通过数据里的children属性。 举个例子：{
label: '汽车',
value: 'car',
children: [
{
转载
2023-12-12 15:08:47
95阅读
什么是虚拟DOM树？（Virtual DOM） 虚拟DOM树其实就是一个普通的js对象，它是用来描述一段HTML片段的 01 当页面渲染的时候Vue会创建一颗虚拟DOM树 02 当页面发生改变Vue会再创建一颗新的虚拟DOM树 
转载
2023-07-03 13:35:03
174阅读
一.Vue渐进式 JavaScript 框架二.Vue安装1.安装node.js node.js中文网下载网址http://nodejs.cn/download/ 下载安装后，打开命令行（win+r 输入cmd）输入node -v 查看node的版本号，若显示如图则安装成功。安装完node.js也就有了npm管理器，它是集成在node中的，输入 npm -v 命令，显示npm的版本信息
转载
2024-02-26 11:03:29
149阅读
递归组件，官方给的教程太简便了，根本看不出到底怎么用。于是自己查网摸索了一下，这儿只把核心思想写出来。效果如下图，点击后打开二级菜单，再点击后打开三级。 //js
//引子
//思想：当v-if=‘false’时，循环时进行的。所以一开始就设置为false。
ggg:{
name:'gs',
template:`
组件的构成组件模块化是
Vue的渐进式框架的特点，了解组件的构成是迈开模块化开发的第一步，组件分为全局组件和局部组件。全局组件：<body>
<div id="app">
<cpn></cpn>
</div>
</body>
`//全局组件
const cpn1 =
Vue.extend({
template:`
转载
2023-11-20 02:11:26
77阅读
应产品的要求，做人生中的第一次换肤项目，在没做之前，确实觉得挺没有头绪的，所以就只能借助于百度啊，然后发现其实element自带的就有换肤功能，虽然看了很多别人的文章，但是想自己写一下加深印象。 一、项目搭建 第一步肯定是根据命令行生成对应的项目框架，然后安装element，根据需求引入自己需要的eleme
转载
2024-05-13 09:25:19
530阅读
公司最近项目是后台管理系统，由我负责，网上找模板发现还需要改很多地方，而且那些模板也没有写代码的实现思路，对于vue项目经验不足者很难看懂，所以就按照自己的思路从零实现一遍，过程讲解还是比较详细的，若是有不足之处还请指正。整体布局：登录： 菜单：准备工作：1、安装elementuinpm i element-ui -S
import ElementUI from
转载
2024-02-08 15:19:31
101阅读
vue和element实现权限树的各种功能权限树功能简介和说明权限树的渲染权限树的父子关联说明通过递归来实现权限树的全选权限树总结 权限树功能简介和说明在工作开发的过程中，项目中需要用到权限管理的相关功能，因此去完成了权限树的开发。在开发中，主要运用vue和elementui进行开发，权限树先进行渲染，然后再完成各种功能。权限树选中父节点不一定选中子节点，选中子节点不一定选中父节点，包含选择和全
转载
2024-04-06 07:48:42
230阅读
一、开始一）安装安装node.js下载网址：https://nodejs.cn/download/node -v #查看node版本
npm -v #查看npm版本，可以成功环境变量配置正确
npm config set registry http://registry.npm.taobao.org #设置npm为淘宝
npm config get regist
转载
2024-07-05 20:51:47
166阅读
一、Element Form资料地址：https://element.eleme.cn/#/zh-CN/component/form下面以Form表单为例，介绍Element UI的使用。第1步：使用脚手架创建vue工程；vue create vue-form第2步：添加element插件。vue add element选择按需加载：第3步：在App.js文件中定义Form表单；<templ
转载
2024-04-21 18:04:52
96阅读
