Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat(components): [cascader] add “checkOnClickNode” prop to CascaderProps #16549

Open
wants to merge 5 commits into
base: dev
Choose a base branch
from
Open

feat(components): [cascader] add “checkOnClickNode” prop to CascaderProps #16549

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
9f377de
feat(components): [cascader] add checkOnClickNode prop to CascaderProps
zuofenghualy Apr 17, 2024
7e552aa
feat(components): [cascader] add checkOnClickNode prop to CascaderProps
zuofenghualy Apr 17, 2024
69231dd
Merge branch 'dev' into feat/cascader-checkOnClickNode
zuofenghualy Apr 19, 2024
fc922bd
Merge branch 'dev' into feat/cascader-checkOnClickNode
zuofenghualy Apr 19, 2024
7b50f7f
Merge branch 'dev' into feat/cascader-checkOnClickNode
zuofenghualy Apr 20, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
29 changes: 15 additions & 14 deletions docs/en-US/component/cascader.md
View file
Open in desktop
Expand Up @@ -223,20 +223,21 @@ cascader/panel

## CascaderProps

| Attribute | Description | Type | Default |
|----------------|------------------------------------------------------------------------------------------------------------|-----------------------------------------------------|----------|
| expandTrigger | trigger mode of expanding options | ^[enum]`'click' \| 'hover'` | click |
| multiple | whether multiple selection is enabled | ^[boolean] | false |
| checkStrictly | whether checked state of a node not affects its parent and child nodes | ^[boolean] | false |
| emitPath | when checked nodes change, whether to emit an array of node's path, if false, only emit the value of node. | ^[boolean] | true |
| lazy | whether to dynamic load child nodes, use with `lazyload` attribute | ^[boolean] | false |
| lazyLoad | method for loading child nodes data, only works when `lazy` is true | ^[Function]`(node: Node, resolve: Resolve) => void` | — |
| value | specify which key of node object is used as the node's value | ^[string] | value |
| label | specify which key of node object is used as the node's label | ^[string] | label |
| children | specify which key of node object is used as the node's children | ^[string] | children |
| disabled | specify which key of node object is used as the node's disabled | ^[string] | disabled |
| leaf | specify which key of node object is used as the node's leaf field | ^[string] | leaf |
| hoverThreshold | hover threshold of expanding options | ^[number] | 500 |
| Attribute | Description | Type | Default |
| ---------------- | ------------------------------------------------------------ | --------------------------------------------------- | -------- |
| expandTrigger | trigger mode of expanding options | ^[enum]`'click' \| 'hover'` | click |
| multiple | whether multiple selection is enabled | ^[boolean] | false |
| checkStrictly | whether checked state of a node not affects its parent and child nodes | ^[boolean] | false |
| emitPath | when checked nodes change, whether to emit an array of node's path, if false, only emit the value of node. | ^[boolean] | true |
| lazy | whether to dynamic load child nodes, use with `lazyload` attribute | ^[boolean] | false |
| lazyLoad | method for loading child nodes data, only works when `lazy` is true | ^[Function]`(node: Node, resolve: Resolve) => void` | — |
| value | specify which key of node object is used as the node's value | ^[string] | value |
| label | specify which key of node object is used as the node's label | ^[string] | label |
| children | specify which key of node object is used as the node's children | ^[string] | children |
| disabled | specify which key of node object is used as the node's disabled | ^[string] | disabled |
| leaf | specify which key of node object is used as the node's leaf field | ^[string] | leaf |
| hoverThreshold | hover threshold of expanding options | ^[number] | 500 |
| checkOnClickNode | whether to check node when clicking on the node | ^[boolean] | false |

## Type Declarations

Expand Down
4 changes: 4 additions & 0 deletions packages/components/cascader-panel/src/config.ts
View file
Open in desktop
Expand Up @@ -80,6 +80,10 @@ export const DefaultProps: CascaderConfig = {
* @description hover threshold of expanding options
*/
hoverThreshold: 500,
/**
* @description whether to check node when clicking on the node
*/
checkOnClickNode: false,
}

export const useCascaderConfig = (props: { props: CascaderProps }) => {
Expand Down
1 change: 1 addition & 0 deletions packages/components/cascader-panel/src/node.ts
View file
Open in desktop
Expand Up @@ -40,6 +40,7 @@ export interface CascaderProps {
disabled?: string | isDisabled
leaf?: string | isLeaf
hoverThreshold?: number
checkOnClickNode?: boolean
}

export type Nullable<T> = null | T
Expand Down
2 changes: 2 additions & 0 deletions packages/components/cascader-panel/src/node.vue
View file
Open in desktop
Expand Up @@ -104,6 +104,7 @@ export default defineComponent({
const isHoverMenu = computed(() => panel.isHoverMenu)
const multiple = computed(() => panel.config.multiple)
const checkStrictly = computed(() => panel.config.checkStrictly)
const checkOnClickNode = computed(() => panel.config.checkOnClickNode)
const checkedNodeId = computed(() => panel.checkedNodes[0]?.uid)
const isDisabled = computed(() => props.node.isDisabled)
const isLeaf = computed(() => props.node.isLeaf)
Expand Down Expand Up @@ -163,6 +164,7 @@ export default defineComponent({
handleCheck(true)
} else {
handleExpand()
if (checkOnClickNode.value) doCheck(true)
}
}

Expand Down