From d43ae50abc9461a9b20b3f015ba3679ba699dfa2 Mon Sep 17 00:00:00 2001 From: LiuHao <liuhaoai545@gmail.com> Date: 星期二, 06 六月 2023 22:52:24 +0800 Subject: [PATCH] update 修改组件 去除无用引用和代码缩进 --- src/components/TreeSelect/index.vue | 76 +++++++++++++++++++------------------- 1 files changed, 38 insertions(+), 38 deletions(-) diff --git a/src/components/TreeSelect/index.vue b/src/components/TreeSelect/index.vue index 8f80377..3076804 100644 --- a/src/components/TreeSelect/index.vue +++ b/src/components/TreeSelect/index.vue @@ -29,94 +29,93 @@ </template> <script setup lang="ts"> -import { ElTreeSelect } from 'element-plus' const props = defineProps({ /* 閰嶇疆椤� */ objMap: { - type: Object, - default: () => { - return { - value: 'id', // ID瀛楁鍚� - label: 'label', // 鏄剧ず鍚嶇О - children: 'children' // 瀛愮骇瀛楁鍚� + type: Object, + default: () => { + return { + value: 'id', // ID瀛楁鍚� + label: 'label', // 鏄剧ず鍚嶇О + children: 'children' // 瀛愮骇瀛楁鍚� + } } - } }, /* 鑷姩鏀惰捣 */ accordion: { - type: Boolean, - default: () => { - return false - } + type: Boolean, + default: () => { + return false + } }, /**褰撳墠鍙屽悜鏁版嵁缁戝畾鐨勫�� */ value: { - type: [String, Number], - default: '' + type: [String, Number], + default: '' }, /**褰撳墠鐨勬暟鎹� */ options: { - type: Array, - default: () => [] + type: Array, + default: () => [] }, /**杈撳叆妗嗗唴閮ㄧ殑鏂囧瓧 */ placeholder: { - type: String, - default: '' + type: String, + default: '' } }) -const selectTree = ref(ElTreeSelect); +const selectTree = ref<ElTreeSelectInstance>(); const emit = defineEmits(['update:value']); const valueId = computed({ get: () => props.value, set: (val) => { - emit('update:value', val) + emit('update:value', val) } }); const valueTitle = ref(''); const defaultExpandedKey = ref<any[]>([]); -function initHandle() { +const initHandle = () => { nextTick(() => { - const selectedValue = valueId.value; - if(selectedValue !== null && typeof (selectedValue) !== 'undefined') { - const node = selectTree.value.getNode(selectedValue) - if (node) { - valueTitle.value = node.data[props.objMap.label] - selectTree.value.setCurrentKey(selectedValue) // 璁剧疆榛樿閫変腑 - defaultExpandedKey.value = [selectedValue] // 璁剧疆榛樿灞曞紑 + const selectedValue = valueId.value; + if (selectedValue !== null && typeof (selectedValue) !== 'undefined') { + const node = selectTree.value?.getNode(selectedValue) + if (node) { + valueTitle.value = node.data[props.objMap.label] + selectTree.value?.setCurrentKey(selectedValue) // 璁剧疆榛樿閫変腑 + defaultExpandedKey.value = [selectedValue] // 璁剧疆榛樿灞曞紑 + } + } else { + clearHandle() } - } else { - clearHandle() - } }) } -function handleNodeClick(node: any) { +const handleNodeClick = (node: any) => { valueTitle.value = node[props.objMap.label] valueId.value = node[props.objMap.value]; defaultExpandedKey.value = []; - selectTree.value.blur() + selectTree.value?.blur() selectFilterData('') } -function selectFilterData(val: any) { - selectTree.value.filter(val) +const selectFilterData = (val: any) => { + selectTree.value?.filter(val) } -function filterNode(value: any, data: any) { +const filterNode = (value: any, data: any) => { if (!value) return true return data[props.objMap['label']].indexOf(value) !== -1 } -function clearHandle() { +const clearHandle = () => { valueTitle.value = '' valueId.value = '' defaultExpandedKey.value = []; clearSelected() } -function clearSelected() { +const clearSelected = () => { const allNode = document.querySelectorAll('#tree-option .el-tree-node') allNode.forEach((element) => element.classList.remove('is-current')) } @@ -132,6 +131,7 @@ <style lang="scss" scoped> @import "@/assets/styles/variables.module.scss"; + .el-scrollbar .el-scrollbar__view .el-select-dropdown__item { padding: 0; background-color: #fff; -- Gitblit v1.9.3