ayiaq1 / el-tree-select

基于element-ui2.x扩展下拉树
224 stars 93 forks source link

大佬,无法开启多选,以及搜索 #41

Closed carveybunt closed 4 years ago

carveybunt commented 4 years ago

可有使用说明文档呀?您的文档里面没看到相关的说明,求指点。

ayiaq1 commented 4 years ago

在线测试可以看到相关配置使用方式

carveybunt commented 4 years ago

@ayiaq1 大佬,新年快乐。 没看到想管的设置以及方法的操作呀.求指点下。 image image

ayiaq1 commented 4 years ago

https://github.com/ayiaq1/el-tree-select/blob/master/src/App.vue

这是以前的测试文件,可以参考下

carveybunt commented 4 years ago

https://github.com/ayiaq1/el-tree-select/blob/master/src/App.vue

这是以前的测试文件,可以参考下

@ayiaq1 您的整个项目的都clone了,就是在本地运行无法实现多选以及过滤的。

image

ayiaq1 commented 4 years ago

{ "treeParams":{ filterable:true }, "multiple": true }

carveybunt commented 4 years ago

{ "treeParams":{ filterable:true }, "multiple": true }

@ayiaq1 大佬,组件里面不设置什么吗? image

ayiaq1 commented 4 years ago

你贴下代码吧,手机上的

carveybunt commented 4 years ago

@ayiaq1 那就麻烦大佬了。看了很久的文档,也 试了很久没弄好多选,以及本地过滤。 <ElTreeSelect v-model="values" :styles="styles" :selectParams="selectParams" :treeParams="treeParams" ref="treeSelect"></ElTreeSelect>

        values: '',
        selectParams: {
            clearable: true,
            placeholder: '请输入内容'
        },
        treeParams: {
            clickParent: true,
            filterable: true,
            'check-strictly': true,
            'default-expand-all': true,
            'expand-on-click-node': false,
            'render-content': this._renderFun,
            data: [
                {
                    testId: 1,
                    name: '节点1',
                    disabled: true,
                    child: [
                        {
                            testId: 111111,
                            name: '子节点'
                        }
                    ]
                },
                {
                    testId: 3,
                    name: '节点3'
                }
            ],
            props: {
                children: 'child',
                label: 'name',
                disabled: 'disabled',
                value: 'testId'
            }
        },
      "multiple": true
ayiaq1 commented 4 years ago

selectParams: { clearable: true, multiple:true, placeholder: '请输入内容' } 放文本框的附加参数内

carveybunt commented 4 years ago

@ayiaq1 大佬,调整了设置,还是无法实现多选呢。

  selectParams: {
        clearable: true,
        multiple:true,
        placeholder: '请输入内容'
    },

image

ayiaq1 commented 4 years ago

版本号多少? 用在线工具引入JS,贴上你的代码看看呢 https://unpkg.com/el-tree-select@3.1.7/dist/el-tree-select.umd.min.js

carveybunt commented 4 years ago

clone您的项目的master,我前端基础差,我学的是后端。 image

ayiaq1 commented 4 years ago

做了一个在线demo: https://codepen.io/ayiaq1/pen/rNaEzdz?editors=1010

v-model的值 也需要为一个数组

carveybunt commented 4 years ago

多谢大佬的指点,我发现,不用设置multiple:true。 单选多选通过设置values就可以了。 拉取下来的项目,默认设置values: '',是单选;改为values: [],则为多选。

还请大佬指点下如何实现过滤。

ayiaq1 commented 4 years ago
        <ElTreeSelect v-model="values" :styles="styles" :selectParams="selectParams" :treeParams="treeParams" ref="treeSelect" @searchFun="_searchFun"></ElTreeSelect>

_searchFun(value) { console.log(value, '<--_searchFun'); // 自行判断 是走后台查询,还是前端过滤 // this.$refs.treeSelect.$refs.tree.filter(value); this.$refs.treeSelect.filterFun(value); // 后台查询 // this.$refs.treeSelect.treeDataUpdateFun(treeData); },

carveybunt commented 4 years ago

万分感谢大佬的耐心指点,全部OK。