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

Vue's H function switches rendering innerHTML and innerText exceptions. #6571

Closed
yushuanggui opened this issue Aug 31, 2022 · 4 comments
Closed
Labels
has workaround A workaround has been found to avoid the problem 🐞 bug Something isn't working

Comments

@yushuanggui
Copy link

yushuanggui commented Aug 31, 2022

Vue version

3.2.12

Link to minimal reproduction

https://jsfiddle.net/yanessa/ryu0np73/25/

Steps to reproduce

  1. the second parameter of the H function is {innerHTML: 'this is innerHTML'},
  2. Change the second parameter of the H function to {innerText: 'this is innerText'}

What is expected?

expected: after switching, the page can render this is innerText

What is actually happening?

actually happening: After switching, the page is rendered as empty

System Info

System:
    OS: Windows 10 10.0.22000
    CPU: (8) x64 11th Gen Intel(R) Core(TM) i5-1155G7 @ 2.50GHz
    Memory: 5.30 GB / 15.79 GB
  Binaries:
    Node: 14.16.0 - D:\tools\nodejs\node.EXE
    npm: 6.14.11 - D:\tools\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22000.120.0), Chromium (104.0.1293.70)
    Internet Explorer: 11.0.22000.120
  npmPackages:
    vue: ^3.2.2 => 3.2.37

Any additional comments?

@LinusBorg
Copy link
Member

Please provide a runnable reproduction as is required in our Issue guidelines

@yushuanggui
Copy link
Author

yushuanggui commented Sep 1, 2022

Please provide a runnable reproduction as is required in our Issue guidelines

https://jsfiddle.net/yanessa/ryu0np73/25/

@LinusBorg LinusBorg reopened this Sep 1, 2022
@LinusBorg LinusBorg added 🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. 🐞 bug Something isn't working and removed 🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. labels Sep 1, 2022
@LinusBorg
Copy link
Member

LinusBorg commented Sep 1, 2022

Workaround: add a key to the element which changes when you switch from one to the other.

@yushuanggui
Copy link
Author

Please provide a runnable reproduction as is required in our Issue guidelines

Workaround: add a key to the element which changes when you switch from one to the other.

Ok, thinks.

@LinusBorg LinusBorg added the has workaround A workaround has been found to avoid the problem label Sep 2, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
has workaround A workaround has been found to avoid the problem 🐞 bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants