Skip to content

Commit 17ce791

Browse files
committed
fix: add node data on bracketsClick & iconClick
1 parent 847ec8c commit 17ce791

File tree

5 files changed

+32
-31
lines changed

5 files changed

+32
-31
lines changed

README.md

+6-6
Original file line numberDiff line numberDiff line change
@@ -135,12 +135,12 @@ plugins: [
135135

136136
## Events
137137

138-
| Event Name | Description | Parameters |
139-
| -------------- | ---------------------------------------- | -------------------- |
140-
| nodeClick | triggers when click node | (node: NodeData) |
141-
| bracketsClick | triggers when click brackets | (collapsed: boolean) |
142-
| iconClick | triggers when click icon | (collapsed: boolean) |
143-
| selectedChange | triggers when the selected value changed | (newVal, oldVal) |
138+
| Event Name | Description | Parameters |
139+
| -------------- | ---------------------------------------- | ------------------------------------ |
140+
| nodeClick | triggers when click node | (node: NodeData) |
141+
| bracketsClick | triggers when click brackets | (collapsed: boolean, node: NodeData) |
142+
| iconClick | triggers when click icon | (collapsed: boolean, node: NodeData) |
143+
| selectedChange | triggers when the selected value changed | (newVal, oldVal) |
144144

145145
## Slots
146146

README.zh_CN.md

+10-9
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
| 属性 | 说明 | 类型 | 默认值 |
1414
| ------------------------ | ------------------------------------------- | --------------------------------- | ------------- |
1515
| data(v-model) | 源数据,注意不是 `JSON` 字符串 | `JSON` 数据对象 | - |
16-
| collapsedNodeLength | 长度大于此阈值的对象或数组将被折叠 | number | Infinity |
16+
| collapsedNodeLength | 长度大于此阈值的对象或数组将被折叠 | number | Infinity |
1717
| deep | 深度,大于该深度的节点将被折叠 | number | Infinity |
1818
| showLength | 在数据折叠的时候展示长度 | boolean | false |
1919
| showLine | 展示标识线 | boolean | true |
@@ -31,23 +31,24 @@
3131
| selectOnClickNode | 支持点击节点的时候触发选择 | boolean | true |
3232
| highlightSelectedNode | 支持高亮已选择节点 | boolean | true |
3333
| collapsedOnClickBrackets | 支持点击括号折叠 | boolean | true |
34-
| renderNodeKey | 渲染节点键,也可使用 #renderNodeKey | ({ node, defaultKey }) => vNode | - |
34+
| renderNodeKey | 渲染节点键,也可使用 #renderNodeKey | ({ node, defaultKey }) => vNode | - |
3535
| renderNodeValue | 自定义渲染节点值,也可使用 #renderNodeValue | ({ node, defaultValue }) => vNode | - |
3636
| editable | 支持可编辑 | boolean | false |
3737
| editableTrigger | 触发编辑的时机 | `click` \| `dblclick` | `click` |
38+
| theme | 主题色 | `'light' \| 'dark'` | `light` |
3839

3940
## Events
4041

41-
| 事件名称 | 说明 | 回调参数 |
42-
| -------------- | -------------------- | -------------------- |
43-
| nodeClick | 点击节点时触发 | (node: NodeData) |
44-
| bracketsClick | 点击括号时触发 | (collapsed: boolean) |
45-
| iconClick | 点击图标时触发 | (collapsed: boolean) |
46-
| selectedChange | 选中值发生变化时触发 | (newVal, oldVal) |
42+
| 事件名称 | 说明 | 回调参数 |
43+
| -------------- | -------------------- | ------------------------------------ |
44+
| nodeClick | 点击节点时触发 | (node: NodeData) |
45+
| bracketsClick | 点击括号时触发 | (collapsed: boolean, node: NodeData) |
46+
| iconClick | 点击图标时触发 | (collapsed: boolean, node: NodeData) |
47+
| selectedChange | 选中值发生变化时触发 | (newVal, oldVal) |
4748

4849
## Slots
4950

5051
| 插槽名 | 描述 | 参数 |
5152
| --------------- | ---------- | ---------------------- |
52-
| renderNodeKey | 渲染节点键 | { node, defaultKey } |
53+
| renderNodeKey | 渲染节点键 | { node, defaultKey } |
5354
| renderNodeValue | 渲染节点值 | { node, defaultValue } |

example/Icons.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@ export const SunIcon = () => (
66
viewBox="0 0 24 24"
77
fill="none"
88
stroke="currentColor"
9-
strokeWidth="2"
10-
strokeLinecap="round"
11-
strokeLinejoin="round"
9+
stroke-width="2"
10+
stroke-linecap="round"
11+
stroke-linejoin="round"
1212
>
1313
<circle cx="12" cy="12" r="5"></circle>
1414
<line x1="12" y1="1" x2="12" y2="3"></line>
@@ -30,9 +30,9 @@ export const MoonIcon = () => (
3030
viewBox="0 0 24 24"
3131
fill="none"
3232
stroke="currentColor"
33-
strokeWidth="2"
34-
strokeLinecap="round"
35-
strokeLinejoin="round"
33+
stroke-width="2"
34+
stroke-linecap="round"
35+
stroke-linejoin="round"
3636
>
3737
<path d="M21 12.79A9 9 0 0112.21 3C11.66 3 11.11 3.05 10.58 3.15A9 9 0 1021 12.79z"></path>
3838
</svg>

src/components/Tree/index.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -229,16 +229,16 @@ export default defineComponent({
229229
}
230230
};
231231

232-
const handleBracketsClick = (collapsed: boolean, path: string) => {
232+
const handleBracketsClick = (collapsed: boolean, node: NodeDataType) => {
233233
if (props.collapsedOnClickBrackets) {
234-
updateCollapsedPaths(collapsed, path);
234+
updateCollapsedPaths(collapsed, node.path);
235235
}
236-
emit('bracketsClick', collapsed, path);
236+
emit('bracketsClick', collapsed, node);
237237
};
238238

239-
const handleIconClick = (collapsed: boolean, path: string) => {
240-
updateCollapsedPaths(collapsed, path);
241-
emit('iconClick', collapsed, path);
239+
const handleIconClick = (collapsed: boolean, node: NodeDataType) => {
240+
updateCollapsedPaths(collapsed, node.path);
241+
emit('iconClick', collapsed, node);
242242
};
243243

244244
const handleValueChange = (value: unknown, path: string) => {

src/components/TreeNode/index.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -84,10 +84,10 @@ export const treeNodePropsPass = {
8484
type: Function as PropType<(node: NodeDataType) => void>,
8585
},
8686
onBracketsClick: {
87-
type: Function as PropType<(collapsed: boolean, path: string) => void>,
87+
type: Function as PropType<(collapsed: boolean, node: NodeDataType) => void>,
8888
},
8989
onIconClick: {
90-
type: Function as PropType<(collapsed: boolean, path: string) => void>,
90+
type: Function as PropType<(collapsed: boolean, node: NodeDataType) => void>,
9191
},
9292
onValueChange: {
9393
type: Function as PropType<(value: boolean, path: string) => void>,
@@ -171,11 +171,11 @@ export default defineComponent({
171171
};
172172

173173
const handleBracketsClick = () => {
174-
emit('bracketsClick', !props.collapsed, props.node.path);
174+
emit('bracketsClick', !props.collapsed, props.node);
175175
};
176176

177177
const handleIconClick = () => {
178-
emit('iconClick', !props.collapsed, props.node.path);
178+
emit('iconClick', !props.collapsed, props.node);
179179
};
180180

181181
const handleSelectedChange = () => {

0 commit comments

Comments
 (0)