fix: add Array type for radio's label prop & fix all bug I know in ca…

…scader
hug-sun · Nov 26, 2020 · 3d98ed8 · 3d98ed8
1 parent f8dd6f5
commit 3d98ed8
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 16 deletions.
diff --git a/packages/cascader-panel/CascaderNode.vue b/packages/cascader-panel/CascaderNode.vue
@@ -34,7 +34,7 @@
       <el-radio
         v-else-if="config.checkStrictly"
         :modelValue="checkedValue"
-        :label="radioLabel"
+        :label="value"
         :disabled="isDisabled"
         @change="handleCheckChange"
         @click="strictlyEvent"
@@ -58,7 +58,7 @@
 </template>
 
 <script>
-import { h, computed, watch, inject, toRefs, Fragment } from 'vue'
+import { h, computed, watch, inject, toRefs, Fragment, watchEffect } from 'vue'
 import ElCheckbox from '../checkbox'
 import ElRadio from '../radio'
 import { isEqual } from '../../src/utils/util'
@@ -99,17 +99,15 @@ export default {
       checkedValue
     )
     const nodeLabel = computed(() => ({
-      render: panel.renderLabelFn,
       node
     }))
     const disabled = computed(
       () => !config.value.checkStrictly && isDisabled.value
     )
-    const radioLabel = computed(() =>
-      isEqual(value.value, checkedValue.value)
-        ? checkedValue.value
-        : value.value
-    )
+    watchEffect(() => {
+      if (isEqual(value.value, checkedValue.value))
+        value.value = checkedValue.value
+    })
 
     const handleMultiCheckChange = (checked) => {
       node.value.doCheck(checked)
@@ -163,7 +161,6 @@ export default {
       // state
       // data
       nodeLabel,
-      radioLabel,
       disabled,
       // useNode
       value,

diff --git a/packages/cascader-panel/CascaderPanel.vue b/packages/cascader-panel/CascaderPanel.vue
@@ -316,6 +316,7 @@ export default {
       },
       lazyLoad,
       getCheckedNodes,
+      getFlattedNodes,
       handleCheckChange,
       handleExpand,
       renderLabelFn,

diff --git a/packages/cascader/Cascader.vue b/packages/cascader/Cascader.vue
@@ -239,7 +239,10 @@ export default {
     },
     clearable: Boolean,
     filterable: Boolean,
-    filterMethod: Function,
+    filterMethod: {
+      type: Function,
+      default: undefined
+    },
     separator: {
       type: String,
       default: ' / '
@@ -737,16 +740,17 @@ const useSuggestion = ({
   const instance = getCurrentInstance()
   const suggestions = ref([])
   const getSuggestions = () => {
-    if (!(filterMethod.value instanceof Function)) {
-      filterMethod.value = (node, keyword) => node.text.includes(keyword)
+    let internalFilterMethod = filterMethod.value
+    if (!(internalFilterMethod instanceof Function)) {
+      internalFilterMethod = (node, keyword) => node.text.includes(keyword)
     }
 
-    const internalSuggestions = panel
+    const internalSuggestions = panel.value
       .getFlattedNodes(leafOnly.value)
       .filter((node) => {
         if (node.isDisabled) return false
         node.text = node.getText(showAllLevels.value, separator.value) || ''
-        return filterMethod.value(node, inputState.value)
+        return internalFilterMethod(node, inputState.value)
       })
 
     if (multiple) {
@@ -769,7 +773,7 @@ const useSuggestion = ({
     if (multiple?.value) {
       const { checked } = targetNode
       targetNode.doCheck(!checked)
-      panel.calculateMultiCheckedValue()
+      panel.value.calculateMultiCheckedValue()
     } else {
       checkedState.value = targetNode.getValueByOption()
       toggleDropDownVisible(false)

diff --git a/packages/radio/Radio.vue b/packages/radio/Radio.vue
@@ -61,7 +61,7 @@ export default {
 
   props: {
     modelValue: [String, Number, Symbol, Boolean, Array],
-    label: [String, Number, Symbol, Boolean],
+    label: [String, Number, Symbol, Boolean, Array],
     disabled: Boolean,
     name: String,
     border: Boolean,