vue3+Element-plus el-select 下拉表格组件（el-select+el-table结合）_财经资讯

创始人

2024-03-14 00:48:26

0次

一、最终效果

在这里插入图片描述

参数	说明	类型	默认值
v-model	绑定值	boolean / string / number	仅显示
table	表格数据对象	Object	{}
—data	展示下拉数据源	Array	[]
—total	数据总条数	Number	-
—pageSize	每页显示条目个数	Number	-
—currentPage	当前页数	Number	-
columns	表头信息	Array	[]
----bind	el-table-column Attributes	Object	-
----noShowTip	是否换行（设置：noShowTip:true）	Boolean	false
----fixed	列是否固定( left, right)	string, boolean	-
----align	对齐方式(left/center/right)	String	center
----render	返回三个参数(text：当前值,row：当前整条数据 ,index：当前行)	function	-
----slotName	插槽显示此列数据（其值是具名作用域插槽）	String	-
------scope	具名插槽获取此行数据必须用解构接收{scope}	Object	当前行数据
keywords	关键字配置（value-key 配置）	Object	无
------label	选项的标签	String	‘label’
------value	选项的值	String	‘value’
radioTxt	单选文案	String	单选
multiple	是否开启多选	Boolean	false
isShowPagination	开启分页	Boolean	false
tableWidth	table 宽度	Number	550

事件名	说明	回调参数
page-change	页码改变事件	返回选中的页码
selectionChange	多选事件	返回选中的项数据及选中项的 keywords.value 集合
radioChange	单选	返回当前项所有数据

方法名	说明	回调参数
focus	使 input 获取焦点
blur	使 input 失去焦点，并隐藏下拉框

gitHub组件地址

gitee码云组件地址

vue3+ts基于Element-plus再次封装基础组件文档

基于ElementUi&antdUi再次封装基础组件文档

上一篇： 玩家必备攻略喜扣跑胡子能开挂吗!(必胜开挂神器)-知乎

下一篇： 我来教教大家海胆巨炮到底有挂吗!(原来是有挂)-知乎