前端
unplugin-auto-import自动导入vue相关函数 setup语法糖,经常需要在导入ref等各类函数,unplugin-auto-import,它可以自动帮你导入vue以及vue-router中各类系统函数,这样就不需要每个组件中import了。
Vue3中setup语法糖使用component切换组件的实现 在element-plus中,使用el-tab动态切换组件是一个非常不错的方案,在项目中也常见。使用setup语法糖的时候,需要定一个Component对象,进行映射。
el-form在typescript中的类型结构 element封装了各类组件,有些组件隐藏的比较深,并一定能找到其对象类型,比如el-form,已经表单中的rules等,这里简单记录一下如何引用。
ElImage轮播图破层不能正常显示,隐藏控件el-image-viewer实现 在el-table组件中,使用el-image组件,轮播图会出现破层的情况,可以使用隐藏组件el-image-viewer来实现,代替el-image的preview-src-list属性
web项目中使用百度地图API及标注目标点 web项目中使用百度地图API及标注目标点,地图中需要标注出自己的所在地,那么必须获取坐标,然后标注坐标,写入js代码就能实现了。
vue3中el-checkbox实现在el-table多行全选功能 在项目中,权限管理中需要使用到多个el-checkbox,每一行都需要单独的实现全选功能,如果是单独的一行数据,相信大家都会,非常简单,但是这是在多行数据里面,就比较麻烦。
vue项目el-table组件中实现行内编辑和新增 el-table通常是用来显示列表,需要新增修改时,大部分场景在模态框中操作。但有时候,仅仅是很简单的一个修改,比如就几个字,用一个el-dialog组件,太重量级,我实现了直接在table内修改。
使用VueCropper对图片进行裁剪 网上搜了很多组件,之前Vue2中使用的是vue-img-cutter组件,非常方便,但是不知道为啥在Vue3中就一直报错,那就只能换成VueCropper,说一下两者的区别
vue中非属性特性非Prop 的Attribute简单实现 但是如果父组件想传递给子组件的属性,并不包含在props中呢?这就是所谓非属性特性,说了白话一点,就是指子组件并没有在props中声明父组件需要传入此属性,而父组件强行给子组件传递属性的行为。
Vue3使用el-tabs切换不同component 是有element-plus开发后台管理程序,通过tab切换不同选项卡来切换不同组件,这是非常常见的,这里就简单记录一下实现方法,话不多说,先看效果。