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

[yanessa-yu]

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]

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

[yanessa-yu]

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

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

[LinusBorg]

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

[yanessa-yu]

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.