Element-plus 第12页

【已解决】vue3 element-plus el-descriptions 挤压不换行显示不全问题

问题描述使用el-descriptions时，当某个数据过长造成整体的内容挤压解决方案：设置css根据浏览器获取的cssdeep修改对应的样式:deep(.el-descriptions__body){.el-descriptions__table.is-bordered.el-descriptions__cell{padding:30px11px;min-width:120px;max-widt

超可爱的奶茶·2023-10-17 13:32

手写el-table-column组件排序效果

需求实现产品列表筛选条件排序，记得element-plus中的el-table-column实现了对表格数据排序的效果，不过俺现在做的是移动端页面，用的vant，vant没有类似的组件，于是打算手写一个

名字太长不好不好·2023-10-17 09:46

vue3后台管理框架之技术栈

vue3全家桶技术基础构建：vue3+vite4+TypeScript代码格式：eslint+pretty+stylelintgit生命周期钩子：huskycss预处理器：sassui库：element-plus

LL1018。·2023-10-17 02:39

vue3+TSX+element-plus（DateTimePicker）做一个时间范围选择器

element-plus包括element-ui支持时间范围选择，把type指定成datetimerange就行了，但是它不支持单个选择，也许unlink-panels这个配置有用，但我是用TSX写的，

吴传逞·2023-10-16 21:57

element-plus + VUE3 项目 build 之后 el-cascader无法选中

在data定义了一个变量。然后对接cascader的v-model值。一切都是那么理所当然。在rundev模式下，完全没问题当发布之后。。。无法选中了。。。后面改成model-value的写法正常了。v-model是vue.js中内置的双向数据绑定指令，用于表单控件以外的标签是不起作用的(即只对表单控件标签的数据双向绑定有效)。

陈熙之·2023-10-16 21:53

Vue3中element-plus全局使用Icon图标

Vue项目中使用Element-plus的Icon图标，包括按钮和动态菜单1、安装图标库npminstall@element-plus/icons2、注册main.ts文件中引入并注册import{createApp

yuliwen0418·2023-10-16 16:06

vue3项目搭建并配置element-plus

第一步：安装node.js，并配置环境变量第二步：安装vue内部命令npminstall-gvue//卸载vue-clinpmuninstallvue-cli-g//安装vue-clinpminstall-g@vue/cli安装完成后，输入如下指令查看vue的版本：vue-V第三步：创建vue项目选择一个要存放项目的目录，打开小黑窗输入如下命令：npminitvue一开始输入项目名称或者默认vue

KrityCat·2023-10-16 16:35

vue3中Element-plus全局配置Dialog遮罩层点击不关闭

在main.js文件中进行如下配置：import{createApp}from'vue'importElementPlusfrom'element-plus'importAppfrom'.

七的不是海·2023-10-16 16:35

Vue3.0 + Ts 项目框架搭建三：element-plus

在main.ts中直接导入：import{createApp}from'vue'importElementPlusfrom'element-plus'impor

对，我·2023-10-16 16:05

vue3 element-plus 全局注册组件

1、首页要在要全局注册的组件下创建一个index.ts文件以上文件主要都要创建2、各个组件下的ts文件内容importtype{App}from'vue'//引入各自的组件importIconSelectfrom'./index.vue'exportdefault{install(app:App){app.component('icon-select',IconSelect)},}3、compon

ZL随心·2023-10-16 16:05

vue3项目如何全局引用Element-plus

1.第一步先安装对应的elemen-plusnpminstallelement-plus2.第二步在main.ts文件中引用对应的文件mportElementPlusfrom'element-plus'import'element-plus

七小山·2023-10-16 16:34

vue3使用babel-plugin-import按需引入element-plus

vue3使用babel-plugin-import按需引入element-plus2022年6月13日更新用babel-plugin-import按需引入element-plus会有问题，用官方推荐的方式真香了

YanzYan·2023-10-16 16:34

七，vue3+vite项目配置--引入element-plus

7.1集成element-plus硅谷甄选运营平台,UI组件库采用的element-plus，因此需要集成element-plus插件！！！

blue_121·2023-10-16 16:34

vue3后台管理框架之全局配置element-plus

前言本篇主要介绍集成element-plus，主要包括全量引入，部分引入，element-plus一些常用配置等element-plus官方文档我们先看看element-plus介绍-----基于Vue3

LL1018。·2023-10-16 16:03

vue(二）vue3 + vite + 自定义svg使用

代码中使用svg图标版本说明:"dependencies":{"element-plus":"^2.2.17","vue":"^3.2.39","vue-router":"^4.1.5"},"devDependencies

qq_30620793·2023-10-16 10:08

Vue3 + Vite3 + Element-Plus 管理系统

Vue3+Vite3+Element-Plus管理系统介绍vue-diverse-admin，基于Vue3、TypeScript、Vite3、Element-Plus开源的一套后台管理模板，项目均使用JS

觀眾·2023-10-16 06:00

VUE3项目element-plus的icons全局引入和按需引入的打包比较

最近又搞vue3项目了，不太情愿的使用element-plus，看到官网上使用icon只有全局循环注册所有icon的配置，很奇怪，不会增大包体积么，简单测试下.新建两个项目都是全局引入element-plus

yusirxiaer·2023-10-15 19:50

vuecli3引入Element-plus

element-ui是vuecli2版本，与vuecli3版本不兼容，故vuecli3则是使用element-plus。

qq_45438471·2023-10-15 11:06

Vue3+Element-plus项目自动导入报错的解决方案

新项目上了vue3，在按需自动导入element-plus组件以后npmrunserve启动报错。

南风吹过人海与长街·2023-10-15 02:51

Vue3 + Element-plus 项目自动导入报错解决方法

前言在创建Vue3+Element-plus项目时，根据Element-plus文档，采用自动导入，安装unplugin-vue-components和unplugin-auto-import两款插件，

varBlue·2023-10-15 02:21

element-ui的el-input组件使用v-model部署出现无法输入情况

html{{msg}}正确vue3jsimport{Search}from'@element-plus/icons-vue'

V I.·2023-10-14 23:31

Vue3常规登录页面模板

登录页面模板以下登录页面模板，基于element-plus和scss，关于elment-plus和scss的环境准备本文不做赘述，包括element-plus图标库的引入。效

sybkl·2023-10-14 20:23

vue3 vite2 发布报 Rollup failed to resolve import “element-china-area-data“ 错误

Rollupfailedtoresolveimport“element-china-area-data”错误解决方法:在项目的vite.config.js中增加如下代码:build:{rollupOptions:{external:["element-plus

程序员岩哥·2023-10-14 14:38

【Element-plus】如何让滚动条永远在最底部（支持在线演示）

如何让滚动条永远在最底部一、适用场景二、实现思路三、效果图四、在线演示五、完整代码一、适用场景在某些场景下，你可能希望滚动条保持在最底部，以确保用户始终看到最新的内容或信息。如：在实时聊天应用程序中，当新消息到达时，滚动条自动滚动到最底部，方便用户立即看到最新的对话。二、实现思路使用nextTick等待DOM更新完成，然后计算出内部容器的总高度max（如：当前可视区只有第4、5、6项，前面的3项已

yulamz·2023-10-14 12:28

从零开始搭建vue3 + ts + pinia + vite +element-plus项目

前言：据说vue2将于2023年12月31日停止维护，最近打算搭建一个vue3项目来学习一下，以防忘记，记录一下搭建过程。一、使用npm创建项目前提条件：已安装16.0或更高版本的Node.js执行“npminitvue@latest”命令来创建vue3项目，大家可以根据自己需要选择，我的选择具体如下图：生成文件夹内容如下：继续输命令：启动项目后进入如下页面：此时，项目已经初步搭建完成，但是我打开

zhoushuizhang·2023-10-14 08:15

vue3.2 element-plus el-tree仅点击子级最后一级高亮，父级不高亮

项目需求tree有两级或三级结构（管理员登录时有三级），展示集团和公司的列表选中集团不高亮无操作选中公司高亮且右侧显示详情点击页面空白失焦，子级高亮不变试了el-tree的配置项，只要失焦，子级高亮就会消失，不满足需求，最后通过slot自己实现关键代码如下，提供个思路代码里边有tree的引导线，用了别人的插件，这部分不需要可以略过//template:class="{hightlight:data

林深灼华·2023-10-14 07:03

vue3 + vite引入scss全局变量

情境：使用了element-plus并按照官方加入了自定义主题的css.也有自己的全局变量globalstyle.scss文件。

月明泉清·2023-10-14 03:08

vue3使用element-plus 树组件（el-tree）数据回显

HTML：JS:constelTreeRef=ref>()constmenuVos=ref([])//菜单树列表constroleForm:any=reactive({})/***获取树节点选中时的id集合*/functionhandleCheckChange(data1:any,data2:any){//选中的子节点constcheckedKeys=data2.checkedKeys//选中的父

乔7426·2023-10-14 00:58

Vue3Element UI plus使用

首先安装：npminstallelement-plus--save然后在项目中引用：importElementPlusfrom'element-plus'import'element-plus/dist

寻找无名的特质·2023-10-13 14:52

vite项目的vite.config.ts配置

配置了element-plus自动按需引入，@路径别名，less能配置全局变量//vite.config.tsimportvuefrom'@vitejs/plugin-vue'import{defineConfig

tingkeiii·2023-10-12 23:31

element-plus el-table 输入框实时筛选

element-plusel-table输入框实现实时筛选实现效果：可以随意输入数字大小写字母或文字输入框实时的去匹配给el-input绑定值2.渲染table表格//这里简写就是正常的el-table表格根据inputValue对应tableData!inputValue||(data.date.includes(inputValue))||data.name.toLowerCase().inc

target_for·2023-10-12 16:33

element-ui element-plus合并行、el-table 行合并，可以指定要合并行的列名称

效果图这里只设置合并了前三列，可以通过参数自己定义1.使用vue3使用导入js文件，并设置需要合并的列//导入js文件(文件脚本内容在下文)import{getRowSpanMethod}from'@/hook/el-tables/use-span-method.js'//调用函数并导出需要的合并列函数注意需要根据//data为查询到的数据//['prop1','prop2','prop3']需要

东明之羞·2023-10-12 14:47

基于Vue3+ele-Plus+Ts封装高级搜索组件，支持JSON数据传入生成搜索条件

创建搜索组件import{reactive}from'vue'importsearchTablefrom'hooks/searchTable'importtype{FormInstance}from'element-plus

难度较大·2023-10-12 01:54

使用@check方法获取id集合

import{ref}from'vue'import{ElTree}from'element-plus'consttreeRef=ref()constgetCheckClick=()=>{constidArray

明明的demo日常·2023-10-11 13:34

vue3.0引入Element UI（Plus）不生效问题

之前使用的都是vue2.0，按惯例element-ui这样引用应该没有毛病，先install再在main.js中引入可控制台报错：原因：vue3.0不兼容element-ui，于是推出了element-plus

Zoriah·2023-10-11 13:12

vue3+ts项目03 element-plus、vue-router、pinia

/App.vue'importElementPlusfrom'element-plus'import'element-plus/dist/index.css'importzhCnfrom'element

假装我不帅·2023-10-11 10:30

表格滚动分页加载——使用element-plus的无限滚动v-infinite-scroll与el-table同时使用出现滚动条定位到底部导致一直请求接口

但我又是个懒蛋，不想手写所以就用了element-plus的无限滚动，但是v-infinite-scroll和el-table这俩搁一块就有bug了啊！！！

阿乐今天敲代码没·2023-10-10 10:27

elementUI实现本地图片上传并回显(前后端)

上传图片到本地路径并返回上传后的地址(本地路径),点击确定按钮才会把图片相关信息保存到数据库.前端单次限制上传一张图片确定importaxiosfrom"axios";import{ElMessage}from"element-plus

卷不过的叫混子·2023-10-10 03:09

Element-plus table 二次封装

前言Element已经提供简洁、样式优雅、易用的table组件，可快速上手。项目中可通过、标签及其属性快速生成一个个性化的独立table，项目中有较多标格展示的情况下，会出现一些问题：1、每个页面都有一整套风格相似的table标签2、对同类型数据做处理时，每个页面都需要引入公用的处理函数3、例如align这种属性有默认值（左对齐），如果UI需要居中或居右，需要对每个标签中的align属性设置。针对

inkbamboo·2023-10-09 10:11

/lib/locale/lang/zh-cn“ entry in “element-plus“ package

主要是element-plus默认为英文，在设置中文的时候报了错将上面main.ts的红框代码改为如下方式即可importlocalefrom"element-plus/es/locale/lang/zh-cn

suoh's Blog·2023-10-09 08:55

vue3使用element plus的时候组件显示的是英文

问题截图这是因为国际化导致的解决代码importzhCnfrom"element-plus/es/locale/lang/zh-cn";或者importzhCnfrom"element-plus/lib

专注前端不学习一天浑身难受·2023-10-08 16:28

vue3的element-plus的el-dialog的样式修改无效问题

问题描述想要修改element-plus的对话框el-dialog中的样式，发现在页面style的scoped属性下，使用:deep深入选择器进行修改是无效的。

小和尚敲木头·2023-10-08 11:10

vue3使用知识点总结

[email protected]使用elementplusui框架npmi-Selementplus//全部引入importElementPlusfrom'element-plus

捕风的紫色鸢尾·2023-10-08 10:57

注册页面编写

相应的路由项要增加，主页面中的按钮也要绑定import{reactive}from"vue";importrouterfrom"@/router";import{Lock,User,Message}from"@element-plus

湿物男·2023-10-08 00:36

vue3+elementPlus ElMessageBox消息框取消按钮位置调整

要求所有的ElMessageBox消息弹出框的取消按钮放在右边，如图代码如下import{ElMessageBox}from'element-plus'constbtnHandle=()=>{ElMessageBox.confirm

再希·2023-10-07 19:26

element-plus自动引入组件报错，例如collapse、loading

element-plus自动引入组件，例如collapse、loading，使用时报错，报错信息如下图所示：解决办法：vite-config.ts改变vue的引入顺序，将vue放在第一个

打盹的小pig·2023-10-07 17:14

element-plus 取消el-input输入框的背景色

.el-input__inner:-webkit-autofill,.el-input__inner:-webkit-autofill:hover,.el-input__inner:-webkit-autofill:focus,.el-input__inner:-webkit-autofill:active{-webkit-transition-delay:99999s;-webkit-trans

打盹的小pig·2023-10-07 17:44

vue3—使用element-plus表格导出excel表格（带图片）

今天制作后台管理系统，有一个二维码管理页面，要求把表格内的数据全部导出为Excel表格。表格内有二维码图片，也要导出，制作的第一版是直接将图片的链接导出，但是要求导出能直接看的图片，所以就有了第二版。第一版：第二版是将图片链接转换成图片的形式接下来我就带大家来看看这两版的实现：第一版安装xlsx插件npminstallxlsx--save在项目中引入import*asXLSXfrom"xlsx";

萝卜头不吃萝卜头·2023-10-07 16:32

vue中的表单手机号和邮箱自定义验证规则

文章目录前言手机号和邮箱的自定义验证前言我们在开发过程中使用elementUI或者element-plus中的表单的时候，会使用到表单验证，比如手机号和邮箱的验证；手机号和邮箱的自定义验证使用很简单，我们首先要在

light多记一点·2023-10-06 15:29

vue3 ElementPlus el-upload 图片列表缩略图模式添加查看大图删除等自定义按钮

且确保图片内容清晰可见隐藏确定保存jsimport{ref,onMounted,reactive}from'vue'importtype{UploadProps,UploadUserFile}from'element-plus'import

toocool404·2023-10-06 01:40

推荐频道

Element-plus