style(TreeSelect.vue): 代码格式化

src/components/TreeSelect/index.vue

@@ -29,7 +29,14 @@
 </template>
 
 <script setup>
-import {ref, getCurrentInstance, nextTick, onMounted, computed, watch} from "vue";
+import {
+  ref,
+  getCurrentInstance,
+  nextTick,
+  onMounted,
+  computed,
+  watch,
+} from "vue";
 
 const { proxy } = getCurrentInstance();
 
@@ -39,101 +46,101 @@ const state = defineProps({
     type: Object,
     default: () => {
       return {
-        value: 'id', // ID字段名
+        value: "value", // 值
-        label: 'label', // 显示名称
+        label: "label", // 名
-        children: 'children' // 子级字段名
+        children: "children", // 子级
-      }
+      };
-    }
+    },
   },
   // 自动收起
   accordion: {
     type: Boolean,
     default: () => {
-      return false
+      return false;
-    }
+    },
   },
   // v-model 绑定的值
   modelValue: {
     type: [String, Number],
-    default: ''
+    default: "",
   },
   // 数据源
   options: {
     type: Array,
-    default: []
+    default: [],
   },
   // 提示文字
   placeholder: {
     type: String,
-    default: ''
+    default: "",
-  }
+  },
-})
+});
 
-const emit = defineEmits(['update:modelValue']);
+const emit = defineEmits(["update:modelValue"]);
 
 const modelValue = computed({
   get: () => {
-    return state.modelValue
+    return state.modelValue;
   },
   set: (val) => {
-    emit('update:modelValue', val)
+    emit("update:modelValue", val);
-  }
+  },
 });
-const valueTitle = ref('');
+const valueTitle = ref("");
 const defaultExpandedKey = ref([]);
 
 function handleNodeClick(node) {
-  valueTitle.value = node[state.props.label]
+  valueTitle.value = node[state.props.label];
   modelValue.value = node[state.props.value];
   defaultExpandedKey.value = [];
-  proxy.$refs.treeSelect.blur()
+  proxy.$refs.treeSelect.blur();
-  selectFilterData('')
+  selectFilterData("");
 }
 
 function selectFilterData(val) {
-  proxy.$refs.selectTree.filter(val)
+  proxy.$refs.selectTree.filter(val);
 }
 
 function filterNode(value, data) {
-  if (!value) return true
+  if (!value) return true;
-  return data[state.props['label']].indexOf(value) !== -1
+  return data[state.props["label"]].indexOf(value) !== -1;
 }
 
 function clearHandle() {
-  valueTitle.value = ''
+  valueTitle.value = "";
-  modelValue.value = ''
+  modelValue.value = "";
   defaultExpandedKey.value = [];
-  clearSelected()
+  clearSelected();
 }
 
 function clearSelected() {
-  const allNode = document.querySelectorAll('#tree-option .el-tree-node')
+  const allNode = document.querySelectorAll("#tree-option .el-tree-node");
-  allNode.forEach((element) => element.classList.remove('is-current'))
+  allNode.forEach((element) => element.classList.remove("is-current"));
 }
 
 function initHandle() {
   nextTick(() => {
     const selectedValue = modelValue.value;
-    if (selectedValue !== null && typeof (selectedValue) !== "undefined") {
+    if (selectedValue !== null && typeof selectedValue !== "undefined") {
-      const node = proxy.$refs.selectTree.getNode(selectedValue)
+      const node = proxy.$refs.selectTree.getNode(selectedValue);
       if (node) {
-        valueTitle.value = node.data[state.props.label]
+        valueTitle.value = node.data[state.props.label];
-        proxy.$refs.selectTree.setCurrentKey(selectedValue) // 设置默认选中
+        proxy.$refs.selectTree.setCurrentKey(selectedValue); // 设置默认选中
-        defaultExpandedKey.value = [selectedValue] // 设置默认展开
+        defaultExpandedKey.value = [selectedValue]; // 设置默认展开
       } else {
-        clearHandle()
+        clearHandle();
       }
     }
-  })
+  });
 }
 
 onMounted(() => {
   initHandle();
-})
+});
 
 watch(modelValue, () => {
   initHandle();
-})
+});
 </script>
 
 <style lang='scss' scoped>
@@ -157,7 +164,7 @@ ul li .el-tree .el-tree-node__content {
 :deep(.el-tree-node__content:active),
 :deep(.is-current > div:first-child),
 :deep(.el-tree-node__content:focus) {
-  background-color: mix(#fff, #409EFF, 90%);
+  background-color: mix(#fff, #409eff, 90%);
-  color: #409EFF;
+  color: #409eff;
 }
 </style>