0.0.8 • Published 5 years ago
fujing-plugin v0.0.8
fujing-plugin介绍
基于element-ui，封装的一些Vue组件
self-tree树形组件、self-tree-select下拉选择树形组件
step
#
需要先安装element-ui包
#
npm install fujing-plugin --save
# main.js
import Plugin from 'fujing-plugin'
import 'fujing-plugin/lib/theme/fujing-plugin.min.css'
Vue.use(Plugin)self-tree
Props
| 属性 | 描述 | 默认值 | 必填 |
|---|---|---|---|
| data | 数据 | [] | 是 |
| treeProps | 树属性 | {children: 'children', label: 'name'} | 否 |
| title | 树组件标题 | 树结构 | 否 |
| showTitle | 是否展示标题 | true | 否 |
| placeholder | 输入框提示文字 | 请输入关键字检索 | 否 |
| needSearch | 是否需要显示搜素框 | true | 否 |
| defaultExpandAll | 是否默认展开所有节点 | false | 否 |
| showCheckbox | 是否显示复选框 | false | 否 |
| accordion | 是否每次只打开一个同级树节点展开 | true | 否 |
Slot
| 名称 | 描述 | 返回值 |
|---|---|---|
| btns | 自定义菜单插槽 | 无 |
| content | 每个节点右边的插槽 | slot-scope="{ node,data }" node:当前节点，data:当前数据 |
Events
| 事件 | 描述 | 返回值 | 必填 |
|---|---|---|---|
| refresh | 刷新回调 | 无 | 是 |
| nodeClick | 树节点点击回调 | 当前节点的data | 否 |
| check | 当复选框被点击的时候触发 | 参考el-tree | 否 |
self-tree-select
Props
size：组件大小 | medium | 非必填
defaultExpandAll：是否默认展开所有节点 | false | 非必填
placeholder：输入框提示文字 | 请选择 | 非必填
treeData：树结构数据 | [] | 必填
treeProps：树props | 如下 |
{
value: 'value', // 选中以后的值
label: 'name', // 展示的名称
children: 'children' 子集合
}