test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-12-02 03:48:13 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

feat: 调整Tabs、Carousel、InputTree组件触发动作索引值，从1开始递增

Browse Source
This commit is contained in:
wutong25 2022-04-27 20:18:29 +08:00
parent 0ee0d2c4f8
commit 34077695bf
8 changed files with 29 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
docs/zh-CN/components/form/input-tree.md
View File

@ -545,9 +545,9 @@ order: 59
}
```
如果层级较多，也可以配置`unfoldedLevel`指定展开的层级数。
如果层级较多，也可以配置`unfoldedLevel`指定展开的层级数，默认展开第 1 层
下例中设置`"unfoldedLevel": 1`，默认展开第 1 层
下例中设置`"unfoldedLevel": 2`，表示展开第 2 层
```schema: scope="body"
{
@ -560,7 +560,7 @@ order: 59
"name": "tree1",
"label": "默认不自动带上子节点的值",
"initiallyOpen": false,
"unfoldedLevel": 1,
"unfoldedLevel": 2,
"options": [
{
"label": "A",
@ -909,7 +909,7 @@ true false true [{label: 'A/B/C', value: 'a/b/c'},{label: 'A
| showRadio | `boolean` | `false` | 是否显示单选按钮，`multiple` 为 `false` 是有效。 |
| showOutline | `boolean` | `false` | 是否显示树层级展开线 |
| initiallyOpen | `boolean` | `true` | 设置是否默认展开所有层级。 |
| unfoldedLevel | `number` | `0` | 设置默认展开的级数，只有`initiallyOpen`不是`true`时生效。 |
| unfoldedLevel | `number` | `1` | 设置默认展开的级数，只有`initiallyOpen`不是`true`时生效。 |
| autoCheckChildren | `boolean` | `true` | 当选中父节点时级联选择子节点。 |
| cascade | `boolean` | `false` | autoCheckChildren 为 true 时生效；默认行为：子节点禁用，值只包含父节点值；设置为 true 时，子节点可反选，值包含父子节点值。 |
| withChildren | `boolean` | `false` | cascade 为 false 时生效，选中父节点时，值里面将包含父子节点的值，否则只会保留父节点的值。 |

2
examples/components/EventAction/CarouselEvent.jsx
View File

@ -3,7 +3,7 @@ export default {
title: '轮播图组件事件',
regions: ['body', 'toolbar', 'header'],
data: {
index: 2
index: 3
},
body: [
{

6
examples/components/EventAction/InputTreeEvent.jsx
View File

@ -46,7 +46,7 @@ export default {
{
name: 'input-tree-expand',
type: 'action',
label: 'expand触发器（openLevel: 1）',
label: 'expand触发器（openLevel: 2）',
level: 'primary',
className: 'mr-3',
onEvent: {
@ -57,7 +57,7 @@ export default {
componentId: 'input-tree-action',
description: '点击展开',
args: {
openLevel: 1
openLevel: 2
}
}
]
@ -91,7 +91,7 @@ export default {
removable: true,
editable: true,
initiallyOpen: false,
unfoldedLevel: 0,
unfoldedLevel: 1,
deferApi: '/api/mock2/form/deferOptions?label=${label}&waitSeconds=2',
options: [
{

8
examples/components/EventAction/TabsEvent.jsx
View File

@ -17,7 +17,7 @@ export default {
actionType: 'changeActiveKey',
componentId: 'tabs-change-receiver',
args: {
activeKey: 0
activeKey: 1
}
}
]
@ -38,7 +38,7 @@ export default {
actionType: 'changeActiveKey',
componentId: 'tabs-change-receiver',
args: {
activeKey: 1
activeKey: 2
}
}
]
@ -59,7 +59,7 @@ export default {
actionType: 'changeActiveKey',
componentId: 'tabs-change-receiver',
args: {
activeKey: 2
activeKey: 3
}
}
]
@ -92,7 +92,7 @@ export default {
actionType: 'toast',
args: {
msgType: 'info',
msg: '更新至${event.data.value}'
msg: '切换至选项卡${event.data.value}'
}
}
]

7
src/components/Tree.tsx
View File

@ -146,7 +146,7 @@ export class TreeSelector extends React.Component<
showIcon: true,
showOutline: false,
initiallyOpen: true,
unfoldedLevel: 0,
unfoldedLevel: 1,
showRadio: false,
multiple: false,
disabled: false,
@ -260,10 +260,11 @@ export class TreeSelector extends React.Component<
onExpandTree?.(nodePathArr);
}
syncUnFolded(props: TreeSelectorProps, unfoldedLevel?: Number) {
syncUnFolded(props: TreeSelectorProps, unfoldedLevel?: number) {
// 传入默认展开层级需要重新初始化unfolded
let initFoldedLevel = typeof unfoldedLevel !== 'undefined';
let expandLevel = initFoldedLevel ? unfoldedLevel : props.unfoldedLevel;
let expandLevel = Number(initFoldedLevel ? unfoldedLevel : props.unfoldedLevel) - 1;
// 初始化树节点的展开状态
let unfolded = this.unfolded;
const {foldedField, unfoldedField} = this.props;

4
src/renderers/Carousel.tsx
View File

@ -199,7 +199,7 @@ export class Carousel extends React.Component<CarouselProps, CarouselState> {
if (!!~['next', 'prev'].indexOf(actionType)) {
this.autoSlide(actionType);
} else if (actionType === 'goto-image') {
this.changeSlide((args as any).activeIndex);
this.changeSlide((args as any)?.activeIndex - 1);
}
}
@ -258,7 +258,7 @@ export class Carousel extends React.Component<CarouselProps, CarouselState> {
const rendererEvent = await dispatchEvent(
'change',
createObject(data, {
activeIndex: current,
activeIndex: current + 1,
prevIndex
})
);

4
src/renderers/Form/InputTree.tsx
View File

@ -125,9 +125,9 @@ export default class TreeControl extends React.Component<TreeProps> {
} else if (actionType === 'reset') {
onChange?.(resetValue ?? '');
} else if (action.actionType === 'expand') {
this.treeRef.syncUnFolded(this.props, action.args.openLevel);
this.treeRef.syncUnFolded(this.props, action.args?.openLevel);
} else if (action.actionType === 'collapse') {
this.treeRef.syncUnFolded(this.props, 0);
this.treeRef.syncUnFolded(this.props, 1);
}
}

11
src/renderers/Tabs.tsx
View File

@ -568,6 +568,7 @@ export default class Tabs extends React.Component<TabsProps, TabsState> {
@autobind
async handleSelect(key: any) {
const {dispatchEvent, data, env, onSelect, id} = this.props;
const {localTabs} = this.state;
env.tracker?.({
eventType: 'tabChange',
@ -576,11 +577,13 @@ export default class Tabs extends React.Component<TabsProps, TabsState> {
key
}
});
// 获取激活元素项
const tab = localTabs?.find((item, index) => key === (item.hash ? item.hash : index));
const rendererEvent = await dispatchEvent(
'change',
createObject(data, {
value: key
value: tab?.hash ? tab?.hash : key + 1
})
);
if (rendererEvent?.prevented) {
@ -612,7 +615,11 @@ export default class Tabs extends React.Component<TabsProps, TabsState> {
*/
doAction(action: Action, args: any) {
const actionType = action?.actionType as string;
const activeKey = args?.activeKey as number;
let activeKey = args?.activeKey as number;
// 处理非用户自定义key
if (typeof args?.activeKey !== 'string') {
activeKey--;
}
if (actionType === 'changeActiveKey') {
this.handleSelect(activeKey);
}