mirror of
https://gitee.com/baidu/amis.git
synced 2024-11-29 18:48:45 +08:00
feat: Tabs组件title支持schema
This commit is contained in:
parent
a97dfe234d
commit
099c9a6ea7
@ -7,7 +7,7 @@
|
||||
import React from 'react';
|
||||
import {ClassName, localeable, LocaleProps, Schema} from 'amis-core';
|
||||
import Transition, {ENTERED, ENTERING} from 'react-transition-group/Transition';
|
||||
import {themeable, ThemeProps} from 'amis-core';
|
||||
import {themeable, ThemeProps, noop} from 'amis-core';
|
||||
import {uncontrollable} from 'amis-core';
|
||||
import {generateIcon, isObjectShallowModified} from 'amis-core';
|
||||
import {autobind, guid} from 'amis-core';
|
||||
@ -137,10 +137,10 @@ class TabComponent extends React.PureComponent<TabProps> {
|
||||
'Tabs-pane',
|
||||
className
|
||||
)}
|
||||
onTouchStart={swipeable && mobileUI && this.onTouchStart}
|
||||
onTouchMove={swipeable && mobileUI && this.onTouchMove}
|
||||
onTouchEnd={swipeable && mobileUI && this.onTouchEnd}
|
||||
onTouchCancel={swipeable && mobileUI && this.onTouchEnd}
|
||||
onTouchStart={swipeable && mobileUI ? this.onTouchStart : noop}
|
||||
onTouchMove={swipeable && mobileUI ? this.onTouchMove : noop}
|
||||
onTouchEnd={swipeable && mobileUI ? this.onTouchEnd : noop}
|
||||
onTouchCancel={swipeable && mobileUI ? this.onTouchEnd : noop}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
@ -660,7 +660,9 @@ export class Tabs extends React.Component<TabsProps, any> {
|
||||
key={this.generateTabKey(hash, eventKey, index)}
|
||||
onClick={() => (disabled ? '' : this.handleSelect(eventKey))}
|
||||
onDoubleClick={() => {
|
||||
editable && this.handleStartEdit(index, title);
|
||||
editable &&
|
||||
typeof title === 'string' &&
|
||||
this.handleStartEdit(index, title);
|
||||
}}
|
||||
>
|
||||
{showTip ? (
|
||||
|
@ -33,7 +33,7 @@ export interface TabSchema extends Omit<BaseSchema, 'type'> {
|
||||
/**
|
||||
* Tab 标题
|
||||
*/
|
||||
title?: string;
|
||||
title?: string | SchemaNode;
|
||||
|
||||
/**
|
||||
* 内容
|
||||
@ -303,7 +303,6 @@ export default class Tabs extends React.Component<TabsProps, TabsState> {
|
||||
if (!tabs) {
|
||||
return [[], false];
|
||||
}
|
||||
|
||||
const arr = resolveVariableAndFilter(source, data, '| raw');
|
||||
if (!Array.isArray(arr)) {
|
||||
return [tabs, false];
|
||||
@ -707,6 +706,18 @@ export default class Tabs extends React.Component<TabsProps, TabsState> {
|
||||
: -1;
|
||||
}
|
||||
|
||||
// 渲染tabs的title
|
||||
renderTabTitle(
|
||||
title: string | SchemaNode | undefined,
|
||||
index: number,
|
||||
data: any
|
||||
) {
|
||||
const {render} = this.props;
|
||||
return isObject(title) && title
|
||||
? render(`tab-title/${index}`, title, {...data})
|
||||
: filter(title, data);
|
||||
}
|
||||
|
||||
renderToolbar() {
|
||||
const {toolbar, render, classnames: cx, toolbarClassName} = this.props;
|
||||
|
||||
@ -775,7 +786,7 @@ export default class Tabs extends React.Component<TabsProps, TabsState> {
|
||||
return isVisible(tab, ctx) ? (
|
||||
<Tab
|
||||
{...(tab as any)}
|
||||
title={filter(tab.title, ctx)}
|
||||
title={this.renderTabTitle(tab.title, index, ctx)}
|
||||
disabled={disabled || isDisabled(tab, ctx)}
|
||||
key={index}
|
||||
eventKey={filter(tab.hash, ctx) || index}
|
||||
@ -816,7 +827,7 @@ export default class Tabs extends React.Component<TabsProps, TabsState> {
|
||||
isVisible(tab, data) ? (
|
||||
<Tab
|
||||
{...(tab as any)}
|
||||
title={filter(tab.title, data)}
|
||||
title={this.renderTabTitle(tab.title, index, data)}
|
||||
disabled={disabled || isDisabled(tab, data)}
|
||||
key={index}
|
||||
eventKey={tab.hash || index}
|
||||
|
Loading…
Reference in New Issue
Block a user