Subscribe on changes!

Generic define component not working (invalid VNode type: undefined (undefined))

avatar
Jan 12th 2021

Version

3.0.5

Steps to reproduce

import { createApp, defineComponent} from "vue";

function Button<T>() {
  return defineComponent({
    render() {
      return <div>test</div>;
    },
  });
}

const app = createApp({
  render() {
    return <Button />;
  },
});
app.mount("#app");

What is expected?

render "test" div

What is actually happening?

got error: invalid VNode type: undefined (undefined)

avatar
Jan 13th 2021

Use h to wrap it:

function Button() {
  return h(defineComponent({
    render() {
      return h('div', 'test');
    },
  }))
}

Or:

const MyComp = defineComponent({
  render() {
    return h('div', 'test');
  },
})

function Button() {
  return <MyComp />
}
avatar
Jan 13th 2021

h works. Not sure if ths is bug, but closing. Thanks for the help