• 2024-09-16ElementPlus表格相关操作大全
            ElementPlus的表格组件(<el-table>)提供了丰富的功能和可扩展性基础表格:通过设置el-table的data属性来插入数据到表格列中,使用prop来指定数据字段,label定义列名,width定义列宽。条纹表格:设置stripe属性为true可以显示条纹间隔的表格。带边框
  • 2024-09-13标准的vue3 elementplus格式,不用export default
    <template><div><!--查询表单--><el-form:inline="true":model="filters"class="demo-form-inline"><el-form-itemlabel="产品料号"><el-inputv-model="filters.
  • 2024-09-06elementplus vue3 table表格动态合并单元格
    letcellList:any[]=[]//单元格数组letcount:number=0//计数constcomputeCell=(tableList:any[],name)=>{cellList=[]count=0for(leti=0;i<tableList.length;i++){if(i===0){//先设置第一项cellList.push(1)
  • 2024-09-03Vite2.0+ElementPlus+Koa2+Mongo全栈开发通用后台系统Vue3
    Vite2.0+ElementPlus+Koa2+Mongo全栈开发通用后台系统Vue3前言当前基于NodeJs框架的全栈工程实践非常之火,作为一个很长时间未接触代码的前程序猿。一直有点手痒痒,想尝试一下这种全新的编程体验,于是就重新开始了填坑的不归之路。这一套框架是基于现在的前后台分离的指导原则来
  • 2024-09-03TS4+Vite+Vitest+Vitepress Vue3.3 自主打造媲美ElementPlus的组件库
    TS4+Vite+Vitest+VitepressVue3.3自主打造媲美ElementPlus的组件库这个问题看起来是想要创建一个类似ElementPlus的Vue组件库,并且使用TypeScript、Vite、Vitest和Vitepress进行开发。以下是一个简化的指南,用于创建一个自己的Vue组件库项目框架。安装必要的工具:npm
  • 2024-09-03Vue3+TypeScript+Vite+Pinia+ElementPlus开发项目在线医疗服务平台
     前言随着vue3.0的越来越受欢迎,开始有许多公司和个人开始学习并使用vue3开发项目。我从接触学习并使用vue2,到现在的vue3,工作中也一直在使用vue。vue3也发布很长时间了,目前vue3+vite+ts再结合一些优秀的UI框架,如Elementplus,Antdesign,NaiveUI,移动端的VantUI,成为了较为流
  • 2024-08-31第七章 项目布局实现(7.4.5)——ElementPlus 自定义命名空间
    7.4.5ElementPlus自定义命名空间参考:https://cn.element-plus.org/zh-CN/guide/namespace.htmlElementPlus提供的默认命名空间为el。在特殊情况下,我们需要自定义命名空间。我们使用sass书写样式,必须同时设置ElConfigProvider和scss$namespace。设置ElC
  • 2024-08-27自动引用elementplus组件
    1、Vue项目中安装ElementPlus#NPM$npminstallelement-plus--save#Yarn$yarnaddelement-plus#pnpm$pnpminstallelement-plus2、组件按需引入配置Vant按需引入---安装:unplugin-vue-components 插件unplugin-vue-components 插件可以在Vue文件中自
  • 2024-08-02Vue3+elementplus遇到的常见问题
    1.跳转同一个路由的时候,只是参数不一样页面不刷新,不会执行onMounted尝试多种方案,包括watch等最终解决方案:router-view设置key属性为路由的完整路径<keep-alive><router-view:key="$route.fullPath"></router-view></keep-alive>eg:左侧菜单是接口返回的  默
  • 2024-07-29elementplus图片预览操作按钮栏增加下载
    1.实现效果:elementplus图片预览组件,自定义增加一个下载按钮,以及下载功能,如图 2.使用的vue3和element plus版本"element-plus":"2.7.6",3.具体代码:(1)使用#viewer插槽:<el-image:title="点击预览":src="getBowserUrl(scope.row.filePath)":z
  • 2024-07-24【组件开发】基于elementplus组件开发的audio音频播放器
    1<template>2<divclass="my-audio">3<!--音频播放器,使用timeupdate事件更新播放进度-->4<audio@timeupdate="updateProgress"controlsref="audioRef">5<source:src="audioUrl&quo
  • 2024-07-23《程序猿入职必会(2) · 搭建具备前端展示效果的 Vue》
  • 2024-07-19Vue3+Elementplus 递归菜单展示
    这里只是做个笔记,js,css那些都没写子组件MenuItem<template><templatev-if="item.children"><el-sub-menu:index="item.value"><template#title>{{item.label}}</template><MenuItemv-for="childI
  • 2024-07-17自研electron31+vue3+elementPlus桌面聊天Exe应用-源码版
    Vue3-ElectronWechat:基于最新前端跨平台技术electron31.x整合高性能构建工具vite.js5搭建的一款高颜值桌面端仿微信界面聊天程序。整个项目采用vue3setup语法糖编码开发,全新封装electron多窗口管理模式。基于vite5+electron31+vue3仿微信客户端聊天【源码版】功能特
  • 2024-05-30elementPlus+vue3易踩的坑之el-radio单选框:为什么默认选项都被勾选了?
    出错的效果:选项都被选中了......明明是从elementplus复制过来的代码(如下),怎么会出现这个情况呢?<el-radio-groupv-model="radio"> <el-radiovalue="1">通过</el-radio> <el-radiovalue="2">不通过</el-radio> </el-radio-g
  • 2024-05-29vue3项目中 路由elementPlus当中的标签页结合封装
    在项目当中大家应该都有看到过,像标签页一样的面包屑吧,接下来我为大家介绍一下,主要组成部分:路由+组件库的标签页。ok就这么easy!!!它实现的方法也不难哦请看效果图ok,在中间实现思路与大家分享一下:主要是使用watch监听我们的route路由的变化,然后根据传递过来的路由信息,进行标签页
  • 2024-05-16vue3 elementplus样式
    科技感日期选择器样式.data_screen.el-picker-panel__footer{color:#87CEEB;background:#00122a;border-top:1pxsolid#274954;}.data_screen.el-picker-panel{color:#87CEEB;background:#00122a;border:1pxsolid#274954;}.data_screen.el-picker-pane
  • 2024-05-14vue3+ts+elementPlus项目搭建
    1.cmd+R  查看是否安装node环境和vue,node-v  出现版本号如果没有,去下载安装,地址: Node.js—DownloadNode.js®(nodejs.org)vue-V   出现版本号如果没有, 输入命令行,全局安装或升级脚手架npminstall-g@vue/cli2.创建vue项目  (项目名
  • 2024-05-06重写 elementPlus 删除方法拦截前 和 tag 标签删除前提示
    <template><el-selectref="myselectref"v-model="currentValue"v-bind="$attrs"><slotname="option"><el-optionv-for="itemin$attrs.options":key="item.v
  • 2024-04-23elementplus中标签页操作
    操作包括关闭所有、关闭其他、向右关闭、向左关闭页面代码<el-tabsv-model="activeName"type="card"class="demo-tabs"@tab-remove="tabRemove"@tab-change="clickTab"><el-t
  • 2024-04-18vue3+elementplus+axios+router的入门项目总结
    一、使用vite方式创建项目:1、创建空文件夹,用vscode打开空文件夹,终端上运行如下命令$npminitvite-app[项目名]:初始化项目$cd[项目名]:进入项目$npminstall:安装项目依赖$npmrundev:启动项目2、启动项目后会出现访问地址: 3、进入访问地址: 二、引入elementpuls
  • 2024-04-1708 Vue3项目搭建后台管理系统
    项目配置elementPlus1.下载安装npminstallelement-plus@element-plus/icons-vue2.main.ts全局注册import{createApp}from'vue';import{createPinia}from'pinia';//1.引入elementPlusimportElementPlusfrom'element-plus';//
  • 2024-04-0905_ElementPlus安装过程
    官网:一个Vue3UI框架|ElementPlus(element-plus.org)1.安装:运行cmd,转到我的项目的目录下\vuedemo,执行命令:npminstallelement-plus--save2.整体导入Element-plus,修改mian.js文件import{createApp}from'vue'//导入Pinia的createPinia方法,用于创建Pinia实例
  • 2024-03-28部署elementPlus离线版本
    最近项目需要离线开发,不能联网查一些组件的api,于是决定搞一个离线版的文档一、下载官方文档下载地址github地址gitee地址选择版本直接下载压缩包二、下载live-server插件全局下载live-server插件npmilive-server-gvscode下载三、运行在文件目录下
  • 2024-03-1307-ElementPlus组件库
    ElementPlus简介ElementPlus是饿了么团队研发的,基于Vue3的组件库准备工作:创建工程化的Vue项目选择TypeScript参照官方文档安装ElementPlus组件库(当前工程的目录下)npminstallelement-plus--savemain.ts中引入ElementPlus组件库参照官方文档//main.tsimpor