feat: select and cascader filterable & clearable as default (ElemeFE#35)

* improvement(select): filterable & clearable as default * improvement(cascader): filterable & clearable as default * chore: eslint --fix
zhn4 · Jan 9, 2020 · bea1de7 · bea1de7
1 parent 9bda3d1
commit bea1de7
Show file tree

Hide file tree

Showing 10 changed files with 32 additions and 20 deletions.
diff --git a/examples/docs/en-US/cascader.md b/examples/docs/en-US/cascader.md
@@ -1916,11 +1916,11 @@ You can customize the content of cascader node.
 | size | size of input | string | medium / small / mini | — |
 | placeholder | placeholder of input | string | — | Select |
 | disabled | whether Cascader is disabled | boolean | — | false |
-| clearable | whether selected value can be cleared | boolean | — | false |
+| clearable | whether selected value can be cleared | boolean | — | true |
 | show-all-levels | whether to display all levels of the selected value in the input | boolean | — | true |
 | collapse-tags | whether to collapse tags in multiple selection mode | boolean | - | false |
 | separator | option label separator | string | — | ' / ' |
-| filterable | whether the options can be searched | boolean | — | — |
+| filterable | whether the options can be searched | boolean | — | true |
 | filter-method | customize search logic, the first parameter is `node`, the second is `keyword`, and need return a boolean value indicating whether it hits. | function(node, keyword) | - | - |
 | debounce | debounce delay when typing filter keyword, in milliseconds | number | — | 300 |
 | before-filter | hook function before filtering with the value to be filtered as its parameter. If `false` is returned or a `Promise` is returned and then is rejected, filtering will be aborted | function(value) | — | — |

diff --git a/examples/docs/en-US/select.md b/examples/docs/en-US/select.md
@@ -532,14 +532,14 @@ If the binding value of Select is an object, make sure to assign `value-key` as
 | disabled | whether Select is disabled | boolean | — | false |
 | value-key | unique identity key name for value, required when value is an object | string | — | value |
 | size | size of Input | string | large/small/mini | — |
-| clearable | whether select can be cleared | boolean | — | false |
+| clearable | whether select can be cleared | boolean | — | true |
 | collapse-tags | whether to collapse tags to a text when multiple selecting | boolean | — | false |
 | multiple-limit | maximum number of options user can select when `multiple` is `true`. No limit when set to 0 | number | — | 0 |
 | name | the name attribute of select input | string | — | — |
 | autocomplete | the autocomplete attribute of select input | string | — | off |
 | auto-complete | @DEPRECATED in next major version | string | — | off |
 | placeholder | placeholder | string | — | Select |
-| filterable | whether Select is filterable | boolean | — | false |
+| filterable | whether Select is filterable | boolean | — | true |
 | allow-create | whether creating new items is allowed. To use this, `filterable` must be true | boolean | — | false |
 | filter-method | custom filter method | function | — | — |
 | remote | whether options are loaded from server | boolean | — | false |

diff --git a/examples/docs/es/cascader.md b/examples/docs/es/cascader.md
@@ -1919,11 +1919,11 @@ Puede personalizar el contenido del nodo de cascada.
 | size | tamaño del input | string | medium / small / mini | — |
 | placeholder | placeholder del input | string | — | Select |
 | disabled | si Cascader esta deshabilitada | boolean | — | false |
-| clearable | si el valor seleccionado puede ser borrado | boolean | — | false |
+| clearable | si el valor seleccionado puede ser borrado | boolean | — | true |
 | show-all-levels | si muestra todos los niveles del valor seleccionado en el input | boolean | — | true |
 | collapse-tags | si se colapsan los tags en la selección múltiple | boolean | - | false |
 | separator | separador de las etiquetas de las opciones | string | — | ' / ' |
-| filterable | si las opciones pueden ser usadas para la busqueda | boolean | — | — |
+| filterable | si las opciones pueden ser usadas para la busqueda | boolean | — | true |
 | filter-method | lógica de búsqueda personalizable. El primer parámetro es `node`, el segundo es `keyword`, y es necesario devolver un valor boolean que indique si se ha tenido éxito. | function(node, keyword) | - | - |
 | debounce | retraso en milisegundos para el tipeo de los datos de filtro | number | — | 300 |
 | before-filter | hook antes de filtrar con el valor a filtrar como parámetro. Si se devuelve `false` o se devuelve una `Promise` y luego se rechaza, se abortará el filtrado. | function(value) | — | — |

diff --git a/examples/docs/es/select.md b/examples/docs/es/select.md
@@ -540,13 +540,13 @@ Si el valor de encuadernación de Select es un objeto, asegúrese de asignar `va
 | collapse-tags        | si se colapsan los tags a un texto cuando `multiple` es `true`. | boolean  | —                 | false            |
 | value-key            | nombre de clave de identidad única para el valor, necesario cuando el valor es un objeto. | string   | —                 | value            |
 | size                 | tamaño del Input                         | string   | large/small/mini  | —                |
-| clearable            | si el select puede ser limpiado | boolean  | —                 | false            |
+| clearable            | si el select puede ser limpiado | boolean  | —                 | true            |
 | multiple-limit       | máximo numero de opciones que el usuario puede seleccionar cuando `multiple` es `true`.  Sin límite cuando se fija a 0 | number   | —                 | 0                |
 | name                 | el atributo `name` del input seleccionado | string   | —                 | —                |
 | autocomplete         | el atributo `autocomplete` del input seleccionado | string   | —         | off              |
 | auto-complete         | @DEPRECATED en la proxima major versión | string   | —         | off              |
 | placeholder          | placeholder                              | string   | —                 | Select           |
-| filterable           | si Select es filtrable                   | boolean  | —                 | false            |
+| filterable           | si Select es filtrable                   | boolean  | —                 | true            |
 | allow-create         | si esta permitido crear nuevos items. Para usar esto, `filterable` debe ser `true`. | boolean  | —                 | false            |
 | filter-method        | método de filtrado personalizado   | function | —                 | —                |
 | remote               | si las opciones se traerán desde el servidor | boolean  | —                 | false            |

diff --git a/examples/docs/fr-FR/cascader.md b/examples/docs/fr-FR/cascader.md
@@ -1916,11 +1916,11 @@ Vous pouvez personnaliser le contenu du noeud cascader.
 | size | Taille de l'entrée | string | medium / small / mini | — |
 | placeholder | Placeholder de l'input | string | — | Select |
 | disabled | Si Cascader est désactivé | boolean | — | false |
-| clearable | Si la valeur sélectionnée peut être effacée | boolean | — | false |
+| clearable | Si la valeur sélectionnée peut être effacée | boolean | — | true |
 | show-all-levels | Afficher ou non tous les niveaux de la valeur sélectionnée dans l'entrée | boolean | — | true |
 | collapse-tags | Réduire ou non les balises en mode de sélection multiple | boolean | - | false |
 | separator | Option label separator | string | — | ' / ' |
-| filterable | Si les options peuvent être recherchées | boolean | — | — |
+| filterable | Si les options peuvent être recherchées | boolean | — | true |
 | filter-method | Personnaliser la logique de recherche, le premier paramètre est `node`, le second est `keyword`, et doit renvoyer une valeur booléenne indiquant si le résultat est positif. | function(node, keyword) | - | - |
 | debounce | Délai de réponse lors de la saisie du mot clé de filtre, en millisecondes | number | — | 300 |
 | before-filter | Hook fonction avant de filtrer avec la valeur à filtrer en tant que paramètre. Si `false` est renvoyé ou si une `Promise` est renvoyée puis rejetée, le filtrage sera annulé | function(value) | — | — |

diff --git a/examples/docs/fr-FR/select.md b/examples/docs/fr-FR/select.md
@@ -535,14 +535,14 @@ Si la valeur de Select est un objet, assurez-vous d'utiliser `value-key` comme i
 | disabled | Si le sélecteur est désactivé. | boolean | — | false |
 | value-key | Identifiant unique pour la valeur, requis quand la valeur est un objet. | string | — | value |
 | size | Taille de l'Input. | string | large/small/mini | — |
-| clearable | Si la sélection est effaçable. | boolean | — | false |
+| clearable | Si la sélection est effaçable. | boolean | — | true |
 | collapse-tags | Si les tags peuvent être réduits, dans le cas d'une sélection multiple. | boolean | — | false |
 | multiple-limit | Nombre maximum d'options multiples sélectionnable. Pas de limites quand est à 0. | number | — | 0 |
 | name | L'attribut name natif du sélecteur. | string | — | — |
 | autocomplete | L'attribut autocomplete natif du sélecteur. | string | — | off |
 | auto-complete | @DEPRECATED dans la prochaine version majeure. | string | — | off |
 | placeholder | Le placeholder du champ. | string | — | Select |
-| filterable | Si les options sont filtrables. | boolean | — | false |
+| filterable | Si les options sont filtrables. | boolean | — | true |
 | allow-create | Si l'utilisateur peut créer des options. Dans ce cas `filterable` doit être activé. | boolean | — | false |
 | filter-method | Méthode de filtrage personnalisée. | function | — | — |
 | remote | Si les options sont chargées dynamiquement depuis le serveur. | boolean | — | false |

diff --git a/examples/docs/zh-CN/cascader.md b/examples/docs/zh-CN/cascader.md
@@ -1895,11 +1895,11 @@
 | size | 尺寸 | string | medium / small / mini | — |
 | placeholder | 输入框占位文本 | string | — | 请选择 |
 | disabled | 是否禁用 | boolean | — | false |
-| clearable | 是否支持清空选项 | boolean | — | false |
+| clearable | 是否支持清空选项 | boolean | — | true |
 | show-all-levels | 输入框中是否显示选中值的完整路径 | boolean | — | true |
 | collapse-tags | 多选模式下是否折叠Tag | boolean | - | false |
 | separator | 选项分隔符 | string | — | 斜杠' / ' |
-| filterable | 是否可搜索选项 | boolean | — | — |
+| filterable | 是否可搜索选项 | boolean | — | true |
 | filter-method | 自定义搜索逻辑，第一个参数是节点`node`，第二个参数是搜索关键词`keyword`，通过返回布尔值表示是否命中 | function(node, keyword) | - | - |
 | debounce | 搜索关键词输入的去抖延迟，毫秒 | number | — | 300 |
 | before-filter | 筛选之前的钩子，参数为输入的值，若返回 false 或者返回 Promise 且被 reject，则停止筛选 | function(value) | — | — |

diff --git a/examples/docs/zh-CN/select.md b/examples/docs/zh-CN/select.md
@@ -527,14 +527,14 @@
 | disabled | 是否禁用 | boolean | — | false |
 | value-key | 作为 value 唯一标识的键名，绑定值为对象类型时必填 | string | — | value |
 | size | 输入框尺寸 | string | medium/small/mini | — |
-| clearable | 是否可以清空选项 | boolean | — | false |
+| clearable | 是否可以清空选项 | boolean | — | true |
 | collapse-tags | 多选时是否将选中值按文字的形式展示 | boolean | — | false |
 | multiple-limit | 多选时用户最多可以选择的项目数，为 0 则不限制 | number | — | 0 |
 | name | select input 的 name 属性 | string | — | — |
 | autocomplete | select input 的 autocomplete 属性 | string | — | off |
 | auto-complete | 下个主版本弃用 | string | — | off |
 | placeholder | 占位符 | string | — | 请选择 |
-| filterable | 是否可搜索 | boolean | — | false |
+| filterable | 是否可搜索 | boolean | — | true |
 | allow-create | 是否允许用户创建新条目，需配合 `filterable` 使用 | boolean | — | false |
 | filter-method | 自定义搜索方法 | function | — | — |
 | remote | 是否为远程搜索 | boolean | — | false |

diff --git a/packages/cascader/src/cascader.vue b/packages/cascader/src/cascader.vue
@@ -205,8 +205,14 @@ export default {
       default: () => t('el.cascader.placeholder')
     },
     disabled: Boolean,
-    clearable: Boolean,
-    filterable: Boolean,
+    clearable: {
+      type: Boolean,
+      default: true
+    },
+    filterable: {
+      type: Boolean,
+      default: true
+    },
     filterMethod: Function,
     separator: {
       type: String,

diff --git a/packages/select/src/select.vue b/packages/select/src/select.vue
@@ -270,8 +270,14 @@
       automaticDropdown: Boolean,
       size: String,
       disabled: Boolean,
-      clearable: Boolean,
-      filterable: Boolean,
+      clearable: {
+        type: Boolean,
+        default: true
+      },
+      filterable: {
+        type: Boolean,
+        default: true
+      },
       allowCreate: Boolean,
       loading: Boolean,
       popperClass: String,