Skip to content

The problem of conflict between custom instructions and v-if in Dropdown #3743

@Hccake

Description

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

Version

1.7.3

Environment

Windows, Chrome, Vue 2.6.12

Reproduction link

Edit on CodeSandbox

Steps to reproduce

  1. 自定义一个Vue 指令(下面简称 v-has),该指令用于在特定情况下删除其所在的元素(主要用于权限控制)
  2. 使用 DropDown,并在其中一个 item 上同时使用,v-if 和 v-has 来控制其渲染(v-if 在前,v-has在后)
  3. 切换绑定的属性值,以便更新 v-if 判断条件的返回值,例如 v-if='a==1',此时切换 v-if 值为 0
  4. 此时 v-if 条件不成立,但是 v-has 条件成立,它们绑定的那个 item 没有问题,但是紧邻该 item 的下一个元素无法正常显示了

What is expected?

v-has 和 v-if 在 dropdown 中应该可以同时使用,且先后顺序不影响其结果

What is actually happening?

vue 自定义指令删除元素 和 v-if 同时控制 dropdown item 渲染时冲突了


实际项目中 当 v-has 在前,v-if 在后时,会导致元素无法正常删除,会被显示。不过这个暂时未在沙盒中复现

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions