feat(Cascader): add option slot (#9111)

This commit is contained in:
neverland 2021-07-24 19:36:10 +08:00 committed by GitHub
parent 09e93eb2ef
commit 2b2cc4add2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 8 deletions

View File

@ -192,13 +192,14 @@ export default {
| --- | --- | --- |
| change | Emitted when active option changed | `{ value, selectedOptions, tabIndex }` |
| finish | Emitted when all options is selected | `{ value, selectedOptions, tabIndex }` |
| close | Emmitted when the close icon is clicked | - |
| close | Emitted when the close icon is clicked | - |
### Slots
| Name | Description |
| ----- | ------------ |
| title | Custom title |
| Name | Description | SlotProps |
| --- | --- | --- |
| title | Custom title | - |
| option `v2.12.25` | Custom option text | _{ option: Option, selected: boolean }_ |
### Less Variables

View File

@ -210,9 +210,10 @@ export default {
### Slots
| 名称 | 说明 |
| ----- | -------------- |
| title | 自定义顶部标题 |
| 名称 | 说明 | 参数 |
| ----------------- | -------------- | --------------------------------------- |
| title | 自定义顶部标题 | - |
| option `v2.12.25` | 自定义选项文字 | _{ option: Option, selected: boolean }_ |
### 样式变量

View File

@ -200,6 +200,10 @@ export default createComponent({
selectedOption &&
option[this.valueKey] === selectedOption[this.valueKey];
const Text = this.slots('option', { option, selected: isSelected }) || (
<span>{option[this.textKey]}</span>
);
return (
<li
class={bem('option', { selected: isSelected })}
@ -208,7 +212,7 @@ export default createComponent({
this.onSelect(option, tabIndex);
}}
>
<span>{option[this.textKey]}</span>
{Text}
{isSelected ? (
<Icon name="success" class={bem('selected-icon')} />
) : null}