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.

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

为antd的editable-card类型的TabPane增加不可删除属性 #4807

Merged
merged 3 commits into from
Feb 13, 2017
Merged

为antd的editable-card类型的TabPane增加不可删除属性 #4807

merged 3 commits into from
Feb 13, 2017

Conversation

lixiaoyang1992
Copy link
Contributor

部分 TabPane 可以删除,部分不可以并且不显示删除按钮

@mention-bot
Copy link

@lixiaoyang1992, thanks for your PR! By analyzing the history of the files in this pull request, we identified @afc163, @benjycui and @yesmeck to be potential reviewers.

@lixiaoyang1992
Copy link
Contributor Author

lixiaoyang1992 commented Feb 9, 2017

需要配合使用:react-component/tabs#50

@coveralls
Copy link

Coverage Status

Coverage remained the same at 82.866% when pulling a8d4c25 on lixiaoyang1992:feature-2.8 into 5b14b4f on ant-design:feature-2.8.

@benjycui
Copy link
Contributor

benjycui commented Feb 9, 2017

这个需要 rc-tabs 那边合并先吧,我没有对应的 npm 权限 @afc163

@ddcat1115
Copy link
Contributor

@lixiaoyang1992 等rc-tabs那边发布了,这边的依赖应该需要升个版本~

type="close"
onClick={e => this.removeTab(child.key, e)}
/>
) : null;
childrenWithClose.push(cloneElement(child, {
tab: (
<div>
{child.props.tab}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

把 unclosable 的 className 加到这里。

react-component/tabs#50 (comment)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

但是样式中的一个hover是针对rc-tabs那里的,在这边没法给tab样式

TabBarMixin.js

  const key = child.key;
  let cls = activeKey === key ? `${prefixCls}-tab-active` : '';
  cls += ` ${prefixCls}-tab`;
  let events = {};
  if (child.props.disabled) {
    cls += ` ${prefixCls}-tab-disabled`;
  } else {
    events = {
      onClick: this.onTabClick.bind(this, key),
    };
  }
  const ref = {};
  if (activeKey === key) {
    ref.ref = 'activeTab';
  }
  rst.push(<div
    role="tab"
    aria-disabled={child.props.disabled ? 'true' : 'false'}
    aria-selected={activeKey === key ? 'true' : 'false'}
    {...events}
    className={cls}
    key={key}
    {...ref}
  >
    {child.props.tab}
  </div>);

这里不处理的话,叉号不显示的时候,tab宽度是不应该变窄的

&&-editable-card > &-bar &-tab:not(&-tab-active):not(&-tab-uncloseable):hover {
   padding-left: 8px;
   padding-right: 8px;
 }

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

确实 tab 上加 className 会比较麻烦。

Copy link
Member

@afc163 afc163 Feb 10, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

可以把原来的样式改成这样,这样就可以在上层做处理了。

image

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

根据这个思路,修改完了

@afc163
Copy link
Member

afc163 commented Feb 10, 2017

closeable => closable

childrenWithClose.push(cloneElement(child, {
tab: (
<div>
<div className={ closable ? undefined : `${prefixCls}-tab-unclosable` }>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

className={} 前后不加空格。

@coveralls
Copy link

Coverage Status

Coverage remained the same at 82.866% when pulling 97c64a8 on lixiaoyang1992:feature-2.8 into 5b14b4f on ant-design:feature-2.8.

@coveralls
Copy link

Coverage Status

Coverage remained the same at 82.866% when pulling 2ceb1d4 on lixiaoyang1992:feature-2.8 into 5b14b4f on ant-design:feature-2.8.

@benjycui benjycui merged commit b88c07f into ant-design:feature-2.8 Feb 13, 2017
@benjycui
Copy link
Contributor

Close: #4286

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

6 participants