vue3 使用jsx开发

Vue 3 支持使用 JSX 语法来编写组件，可以更灵活地控制组件的渲染和行为。下面是使用 Vue 3 和 JSX 编写一个简单的组件的示例：

import { defineComponent } from 'vue'

export default defineComponent({
  props: {
    title: String,
  },
  setup(props) {
    return () => (
      <div class="card">
        <h2>{props.title}</h2>
        <p>Some content here.</p>
      </div>
    )
  },
})

在这个示例中，我们使用 `defineComponent` 函数来定义一个组件，然后在 `setup` 函数中使用箭头函数返回组件的 JSX 模板。在 JSX 中，我们可以使用类似 HTML 的语法来描述组件的结构和属性，同时也可以使用 JavaScript 表达式来动态计算属性值。

需要注意的是，在使用 JSX 时，需要使用 `vue-jsx-plugin` 插件来解析 JSX 语法，同时也需要引入 `@vue/runtime-dom` 模块来支持渲染和更新组件。具体使用方式可以参考 Vue 3 官方文档中的相关介绍。