vue-elementui-admin 动态路由渲染在官网下载vue-elementui-admin，进行二次开发，实现动态路由渲染，用户登录后，通过接口从服务端获取权限列表，然后渲染到侧边栏。注意：此次二次开发未涉及角色（role）删选，需要角色删选权限的可以绕行1、router.js（@/router/router.js）定义constantRouterMap：放置所有权限都需要的路由表，例如
转载
2024-09-27 09:13:05
65阅读
恳求sf的管理大大，不让驳回我的文章了，我是把文章的好多注释直接写到代码里边了，并不是文章太短
前言 有这么一个需求，
根据登录用户的权限，页面上会动态显示几个表单,是的，独立的几个表单(就是有这样的需求)。 这些动态的表单呢，样式都一样，都需要做校验，并且提交的时候， 只能提交有权限且验证通过的表单 线上demo: http://an888.net/sf/c
转载
2024-04-25 22:10:48
232阅读
el-table添加一行是很简单的操作 push 数据进数组就ok了 但是想在原有的表上动态添加一列怎么办呢？ 我是做了一个弹框去用于添加数据用代码层的实现HTML部分<el-table
:data="goodsList1.slice((currentPage1 - 1) * pagesize1, currentPage1 * pagesize1)"
转载
2024-04-20 11:03:02
228阅读
需求：根据用户的选择的运输方式，
动态改变输入框的输入条件，并且整个表单是可以循环
添加多项，实现对数据批量校验。效果图如下：首先，表单可以新增加，则是一个循环表单；给 el-form-item 加上 prop 属性，对每一组中的这一项都进行校验。<div v-for="(k,index) in formData.lists">
<template>
<el-
转载
2024-03-22 21:46:37
190阅读
Vue+Element的动态表单，动态表格（后端发送配置，前端动态生成）动态表单生成ElementUI官网引导Element表单生成Element动态增减表单,在线代码关键配置template中,form和form-item的写法和绑定data里的值为空methods中，向后台获取数据的函数写法1. form,form-item,input的写法[^code]<el-form :model=
转载
2024-03-29 07:05:58
495阅读
项目开发过程中，我们有时候会遇到表格里面数据进行动态添加修改删除的操作，表格里面我们也会经常遇到合并单元格和合计累加计算行的数据。这里我们就简单的记录一下实际场景的运用！最终实现的效果图如下： 注意：这里的新增操作人不能重复添加，新增的时候有删除操作，有编辑的数据进来的时候表格里面才会显示编辑文字。1，添加动态表格return {
// 表格数据
productivityForm: {
转载
2024-02-19 13:53:04
329阅读
先看下面这个框框经过使用发现其实BUG很多,如不能传递#default,不能使用多级表头等 工作接了个需求，需要实现表格的动态列，但是后端又不参与，全权交给前端，百度搜了一下，大多都是el-table-column的for循环，我觉得用起来不爽，还得改变el-table-column的书写方式，用对象保存列的相关信息，所以搞了一个这玩应效果就是不改变书写习惯而且还能达到前端控制列的显示与隐藏话不多
转载
2024-04-29 12:54:13
746阅读
Vue + Element UI 实现权限管理系统 前端篇（十）：动态加载菜单 动态加载菜单之前我们的导航树都是写死在页面里的，而实际应用中是需要从后台服务器获取菜单数据之后动态生成的。我们在这里就用上一篇准备好的数据格式Mock出模拟数据，然后动态生成我们的导航菜单。接口模块化我们向来讲究模块化，之前接口都集中在，interface.js，我们现在把它改名为 api.js，并把里边原来
【代码背景】 查询指标展示不同的表格，这些表的表头样式类似但是又不完全相同，怎么做呢？ 到目前为止所有基于Element UI的表格样式都是直接在页面写死的，像官方这样：<el-table :data="tableData" style="width: 100%">
<el-table-column prop
转载
2024-03-25 07:20:33
725阅读
之前有一些网友对我那个IT部门信息管理系统（http://caijt.com/it）的前端感兴趣，我已经开源到github（https://github.com/Caijt/itsys-ui）上面有两个分支，master是对应php后端的，itsys-net是对应asp.net core后端的。这里我简单介绍下我这个系统前端代码，当时我几乎完全参考vue-element-admin的，不过没用它的
转载
2024-04-02 15:54:16
180阅读
需要注意的是include/exclude绑定的属性是页面中设置的name值 而不是路由中的name值 基础使用方法<keep-alive include="mytemplate">
<router-view ></router-view>
</keep-alive>export default {
name：'mytemplate
转载
2024-04-07 11:20:30
524阅读
1.项目简介2.项目使用到的技术3.功能实现3.1登录功能初始化Login.vue<template>
<div class="login_container">
</div>
</template>
<script>
export default {
}
</script>
<
效果图安装 Element-ui 和 egrid 基于 Element-UI Table 组件封装的高阶表格组件，可无缝支持 element 的 table 组件npm i element-ui -S
npm i egrid -S引入 Element-ui 和 Egrid 在 main.js 文件里引入并注册 ( 这里是 Vue3.0 的模板 )import Vue from 'vue
转载
2024-04-03 08:31:01
82阅读
EelementUI 搭建项目框架+
页面路由跳转一、整体布局示意图、总体布局 Main.vue组件、index.js总路由1、Main.vue 组件，所有框架组件的父组件<template>
<div id="main">
<!-- 头部 -->
<!-- 高为80px -->
转载
2024-04-01 18:27:21
536阅读
一、创建阿里图标库项目打开网址点击右侧文件夹【创建项目】填写【项目名称】，【FontClass】前缀填好后，后续使用icon图标时会使用该前缀，类似于element icon 写法二、图标加入项目找到你想要的图标，点击加入购物车点击网页顶部的购物车图标，把购物车中的所有图标加入到项目中三、下载图标文件，并添加到Vue项目点击【生成代码】，然后【下载文件】文件下载后的目录结构，并删掉多余的文件解压文
转载
2024-08-30 13:36:54
325阅读
vue中实现动态菜单功能数据存储问题 (刚接触前端不久,有问题请积极指正) 在vue.js中通过router.beforeEach(async(to, from, next) => {})方法来拦截路由实现动态菜单功能,这时候就需要一个存储介质来实现用户角色或者用户路由数据的存储.最开始我针对动态菜单功能的解决方案是使用localStroage来存储用户对应的路由数组信息,但是在实际应
重点：addRoutes方法添加路由1、首先在本地配置好固定不变的路由地址，例如登录，404这些页面，如下:import Vue from 'vue'
import Router from 'vue-router'
// import HelloWorld from '@/components/HelloWorld'
import store from '@/vuex/store'
Vue.us
转载
2024-10-08 15:00:12
67阅读
在使用element-ui开发中，经常会用到对动态创建的表单进行字段验证，比如新增多个类似卡片的表单，里面的字段需要做验证，此时就要使用到动态表单验证，官方文档写的有示例，但是不够清晰。除了官方示例，还可以使用循环生成多个form实现该需求。第一种官方示例：一个Form多项下面以实际项目中的代码为例：<el-form ref="form" :model="form" :rules="rule
转载
2024-03-03 16:07:11
262阅读
实战场景描述实际开发过程中，需要Tab切换不同类型的数据，如果是每个Tab表单是静态数据还好，但通常情况下基本上涉及的都是table数据，页面打开时，我们看到的是一个打开的Tab内容，但其实vue是把所有的内容都渲染了，只是其他都隐藏了，这种可能就会造成打开页面时因为需要同时加载多个数据而卡顿，最佳实现思路肯定是Tab切换时才进行实时加载。1、确定好每个Tab内容参考官网的例子改成我们的内容就好2
转载
2024-03-18 21:06:38
814阅读
上一部分总结了基础常用的js表单校验，包括原生以及框架，下面来总结这一个月涉及到的动态校验：动态表单校验大致分为三种情况：首先是固定校验规则，但是表单组件是动态生成的，例如：在表单或者表格里有“增加”功能，增加一行，给新生成的表单组件添加校验规则。第二类就是组件固定，但是校验规则会随着其他条件的变化而变化，例如：基本的最常见的例子是确认密码的校验，判断第二次输入的密码与第一次输入是否一致。最后，比
转载
2024-06-19 13:11:19
3999阅读
点赞
1评论
