基于elementUI的菜单（element-menu）展示（无线级）【代码】【图】

可以通过 npm install element-menu进行安装 <script> export default {name: 'menu-items',props: ['menuList', 'active_menu'],render: function(h) {var showMenu = menuList => {if (menuList.length > 0) {return menuList.map((menuItem, index) => {if (menuItem.children.length > 0) {return (<el-submenu index={menuItem.id} key={ menuItem.id} title={menuItem.text}><template slot="title"><i class={`iconfont ${m...

权限管理系统--前端篇（二）初步体验ElementUI【图】

1、使用IDE打开项目，打开IDE->文件->打开文件夹->选择kiven-ui项目目录2、UI官网地址：http://element-cn.eleme.io/#/zh-CN/component/installation3、安装ElementUI基于先前已经安装，如果需要单独安装就cd kiven-ui项目根目录，直接执行cnpm install element-ui --save-dev3、项目中引入ElementUI在 main.js 中引入 element，引入之后，main.js 内容如下：在ElementUI的官网中加入一个组件测试效果即可； 4、使用scss样式（1）安...

ElementUI 实现el-table 列宽自适应【代码】【图】

一、概述 Element UI 是 PC 端比较流行的 Vue.js UI 框架，它的组件库基本能满足大部分常见的业务需求。但有时候会有一些定制性比较高的需求，组件本身可能没办法满足。最近在项目里就碰到了。 很多页面都需要用到表格组件el-table。如果没有给el-table-column指定宽度，默认情况下会平均分配给剩余的列。在列数比较多的情况，如果el-table宽度限定在容器内，单元格里的内容就会换行。强制不换行，内容要么在单元格内滚动，要么就会...

elementUI-select 远程搜索【代码】

设置三个远程属性，调用模糊接口<template><ui-selectv-model="selectedPeopleId"filterableremotereserve-keywordplaceholder="请输入人名进行搜索":remote-method="userSearch":loading="userSearchLoading"@change="userSelected"><ui-optionv-for="item in userResult":key="item.id":label="item.userName":value="item.id"></ui-option></ui-select> </template><script>import api from ‘@/api/user‘export default {comp...

Bug | ElementUI 表单重置无效【图】

问题描述 在使用 elementui 时出现一个问题, 就是 我调用引用对象的 resetFields 方法时,方法无效 解决方法 确保设置了 ref 和 prop , 我是没有设置 prop 才会导致失效, 我不是很熟悉前端的东西, 猜测可能是通过这个 prop 字段来重置表单数据的

elementUI中在Tabs标签页的标题文字后面添加elementUI自带图标和自定义图标【代码】【图】

1.添加自带图标：下箭头 <el-tab-pane name="first"><span slot="label"><span class="span-box"><span>最新发布</span><span class="el-icon-arrow-down"></span></span></span> </el-tab-pane> 2.添加自定义图标 html<el-tab-pane name="first"><span slot="label"><span class="span-box"><span>预警</span><el-tooltipclass="item"effect="dark"content="2"placement="bottom-start"><span class="btn-bell-badge"><span...

elementui 实现select下拉框互斥功能【图】

基于elementui的年月日周时间控件【代码】

组件 <template><div class="component_search_form_date clearfix"><el-radio-group v-model="curType" :size="moduleSize" style="float: left;" @change="radioChange"><el-radio-button v-for="item in showBtnList" :key="item.value" :label="item.value">{{ item.name }}</el-radio-button></el-radio-group>&emsp;<div style="display: inline-block; float: left; margin-left: 5px;"><template v-if="dateType == 'dater...

elementui resetFields方法重置表单失败

转自：https://blog.csdn.net/john1337/article/details/89674876 <el-form :inline="true" :model="form" ref="form1" class="form-inline"> <el-form-item label="工号：" prop="jobNumber"> <el-input v-model="form.jobNumber" placeholder="请输入工号" clearable></el-input> </el-form-item> <el-for...

elementui中使用tree组件，点击选中check-change事件执行多次【图】

当点击选中时使用check-change函数处理数据发现check-change事件被执行多次， check-change监听状态改变，在此处点击勾选后状态发生改变，因此再次触发了check-change事件 check事件监听点击动作，只在点击时触发 将check-change事件改为check事件。原文：https://www.cnblogs.com/dubayaoyao/p/14945830.html