Version

3.2.24

Reproduction link

codesandbox.io

Steps to reproduce

import { createApp, defineComponent, h } from "vue";

const App = defineComponent({
  setup() {
    return () => h("div", { innerHTML: undefined }, "a");
  }
});

createApp(App).mount("#app");

I want to change innerHTML of props and children dynamic at same time.

What is expected?

no Error and use innerHTML if provided or children content.

What is actually happening?

throw an error.

TypeError Cannot read properties of undefined (reading '__asyncLoader')

as a workaround

import { createApp, defineComponent, h } from "vue";

const App = defineComponent({
  setup() {
    // return () => h("div", { innerHTML: undefined }, "a");
    return () => h("div", { innerHTML: undefined });
  }
});

createApp(App).mount("#app");

In your case, innerHTML conflicts children, there can only be one

function h(type: any, propsOrChildren?: any, children?: any)

as a workaround

import { createApp, defineComponent, h } from "vue";

const App = defineComponent({
  setup() {
    // return () => h("div", { innerHTML: undefined }, "a");
    return () => h("div", { innerHTML: undefined });
  }
});

createApp(App).mount("#app");

In your case, innerHTML conflicts children, there can only be one

function h(type: any, propsOrChildren?: any, children?: any)

I use createVNode for dynamic rendering. so I must make vnode innerHTML/children responsive.

Add a key of props for force update. it's work.

h("div", { innerHTML: html, key: html }); 
h("div", {}, content);

As a workaround delete the innerHTML property if you want to pass children