Skip to content

When the Tag component is closed, it is affected by animation and causes data rendering errors. #4559

@IanLew

Description

@IanLew
  • I have searched the issues of this repository and believe that this is not a duplicate.

Version

1.7.7

Environment

os version: windows10, browser version: Google Chrome 91.0.4472.106, Vue version: 2.6.14

Reproduction link

Edit on CodeSandbox

Steps to reproduce

Tag组件close事件只是隐藏选项,假如删除数据重新渲染,就会出现删除项所在索引的选项被隐藏。close事件并不是在动画执行完成后触发的,而是点击之后就被触发。数据触发DOM删除,但是此时动画还未完成,从而导致删除项所在索引的选项被隐藏。

What is expected?

close事件下无论是隐藏元素还是删除元素都只有触发的选项产生效果

What is actually happening?

close事件下不该被隐藏的元素被隐藏了


业务场景:多tab多checkbox的情况下使用tag显示数据,当触发tag关闭的时候,同时移除checkbox选中状态。不使用$set对tag数据做更改可以避免被隐藏,但是触发checkbox数据更新同样会导致tag隐藏不该隐藏的选项。

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions