czhl-tmp

使用方法
6,581
Install
npm install czhl-tmp
Latest Version:0.1.6
Vue:3
Last Updated:Mar 9, 2022
Links: npm
Maintainer: yyitian

基于 Vue 3 + Typescript + Vite + Element Plus 的常用组件库

使用方法

npm install czhl-tmp

组件使用说明

表单筛选框配置 queryConfig

属性 说明 类型 可选值 默认值
label - string - -
prop 必填，对应表单键名 string - -
type 表单类型 string input/select/year/month/date/datetime/week/datetimerange/daterange -
placeholder - - - -
options 仅当 type 为 select 时有效，select 下拉数据，格式参照 element array - -
valueFormat 仅当 type 为时间相关类型时有效，格式化所选择时间的值 string 参照时间类型 YYYY-MM-DD HH:mm:ss

表单筛选框事件

事件名 说明 回调参数
onSearch form 表单值改变时触发 form 表单数据

表格数据属性设置 data

注意：data 为包含 list 和 total 的结构体 默认为 { list:[], totla: 0 }

表格配置 tableConfig

属性 说明 类型 可选值 默认值
selection 选择功能 boolean - false
multiple 当 selection 为 true 时有效，是否多选 boolean - true
column 表单项 array - -
toolBar 操作栏项 array - -

表格 column 配置 tableConfig.column

属性 说明 类型 可选值 默认值
label - string - -
prop - string - -
formatter 列格式化 function - -
selectable 默认勾选，当 selection 为 true 时有效，实验性功能 array - -

表格 toolBar.column 配置 tableConfig.toolBar

toolBar 为 object,也支持设置 width 和 label，这里主要说 column 配置

属性 说明 类型 可选值 默认值
type 操作按钮类型 string 参考 element button 类型 -
show 动态展示按钮 function - -
disabled 禁用按钮 function - -
label 按钮文字 string - -
labelFunction 动态按钮文字 function - -

表格分页配置 pageConfig

属性 说明 类型 可选值 默认值
show 是否显示分页器 boolean - -
pageSize - number - -
currentPage - number - -
layout 参考 element 分页 layout boolean - -
官方源

npm config set registry=https://registry.npmjs.org/

淘宝源

npm config set registry=https://registry.npm.taobao.org/

Version History

Version Released Vue License
0.1.6 ^3.2.16
0.1.5 ^3.2.16
0.1.4 ^3.2.16
0.1.3 ^3.2.16
0.1.2 ^3.2.16