使用composition api创建vue 3组件的实例

Question

假设我在 vue3 中使用以下语法创建了一个组件

// Message.vue
<script setup lang="ts">
const props = defineProps<{
    message: string
}>();
</script>

<template>
<span>{{ props.message }}</span>
</template>

如何创建此消息组件的实例？

import Message from "./Message"

let message1 = Message({message:"hello world"}); // how to do this?

这样我就可以将 message1 与 一起使用，例如

Answer 1

您可以将以下导入添加到文件中。

import { createApp, h } from "vue";

然后以这种方式创建消息组件。

let message1 = createApp({ 
  setup () {
    return () => h(Message, {message: "hello world"});
  }
});