Vue 3 使用 render 函数渲染内容：示例教程

在 Vue 3 中，你可以使用 render 函数代替 template 模板来渲染组件内容，这提供了更大的灵活性。以下是一个简单的示例，展示如何使用 render 函数渲染文本内容：

import { createApp } from 'vue'

const app = createApp({
  data() {
    return {
      message: 'Hello, Vue 3!'
    }
  },
  render() {
    return h('div', this.message)
  }
})

 app.mount('#app')

在这个例子中，我们使用了 Vue 3 的 createApp 函数来创建一个 Vue 实例。在这个实例中，我们定义了一个 data 属性，包含一个 message 属性，用于存储要显示的消息。

接下来，我们使用了 Vue 3 的 render 函数来定义要渲染的内容。在这个例子中，我们使用了 h 函数来创建一个 div 元素，并将 message 作为它的内容。最后，我们通过调用 mount 函数来将 Vue 实例挂载到页面上。