Hawthorn-Api

# HtSelect 字典框

HtSelect 自定义输入框组件，基于el-select实现；
Author andy.ten@tom.com & xukaixing@hotmail.com

# 示例

<template>
  <div>
    <ht-form ref-form="dictForm" :form-list="dictFormList" divider="字典组件" :form-style="{width:'800px'}" />
  </div>
</template>
<script>
export default {
  data() {
    return {
      dictFormList: [
        {
          type: 'dic',
          format: [0, 'isDic', 10],
          dicType: 'E#100601=集团:10602=分公司',
          label: '标准字典',
          field: 'dict01'
        },
        {
          type: 'dic',
          format: [0, 'isDic', 100],
          dicType: 'E#100601=集团:10602=分公司',
          label: '多选字典',
          field: 'dictMultiple',
          multiple: true
        },
        {
          type: 'dic',
          format: [0, 'isDic', 10],
          dicType: 'E#100601=集团:10602=分公司',
          label: '字典框禁用',
          field: 'dictDisabled',
          disabled: true
        },
        {
          type: 'dic',
          format: [0, 'isDic', 10],
          dicType: 'E#100601=集团:10602=分公司',
          label: '枚举字典',
          field: 'dictEnums'
        },
        {
          type: 'dic',
          format: [0, 'isDic', 10],
          dicType: 'E#100601=集团:10602=分公司',
          label: '过滤字典',
          field: 'dictFilter',
          filtercode: '100601|100605' // 正则表达式方式
        },
        {
          type: 'dic',
          format: [0, 'isDic', 10],
          dicType: 'E#100601=集团:10602=分公司',
          label: '带默认值',
          field: 'dictDefaultVal',
          value: '100601',
          showLabel: '集团公司'
        },
        {
          type: 'dic',
          format: [0, 'isDic', 30],
          label: '表选字典',
          field: 'dictTable',
          dicType: 'E#100601=集团:10602=分公司',
          dicRemote: (dicType, query) => findDictFromTable(dicType, query),
          cb: (row) => this.handleDicCallBack(row)
        }
      ],
    } 
  }
};
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
Expand Copy

# API

# Select Attributes

参数 说明 类型 可选值 默认值
vref 设置select的ref属性 String — —
name 设置select的name属性 String — —
value 设置select的value属性 String,Number,Boolean,
Array,Object		 — —
label 设置select框的label属性 String — —
showLabel 设置select框的默认值的label属性 String — —
placeholder 设置placeholder属性 String — 请选择
disabled 设置disabled属性 Boolean,String true / false false
clearable 设置是否可清除内容 Boolean true / false true
visible 设置是否可见 Boolean true / false true
multiple 设置是否多选 Boolean true / false false
collapseTags 多选时是否将选中值按文字的形式展示 Boolean true / false false
filterable 设置是否支持输入过滤 Boolean true / false true
filtercode 设置默认的过滤值 String — —
dicType 设置字典类型(required) String 字典类型 true
dicRemote 表选字典请求远程方法 Function — —
cb 字典选中后回调方法 Function — —
isreload 表选字典是否使用缓存 Boolean true / false false
biz-type 业务属性：tableedit-表格输入框 String tableedit tableedit
editRow 行编辑当前编辑行对象 Object — —
columnProp 当是表格编辑input时列属性值 String — —

# Select Event

方法名 说明 参数
clear 获取清空响应方法 (event)
change 获取选中字典后回调用方法 (val)

# 版本

  • v1.3.2

← HtCascader级联字典框 →