JSX
是JavaScript
的一个类似XML
的扩展,那么JSX
如何在vue3
中使用呢?下面编程教程网小编给大家详细介绍一下!
vue3+vite
的项目不支持/code>jsx,如果想支持jsx,需要安装插件。
1、安装jsx脚手架
npm i @vitejs/plugin-vue-jsx -D
2、在vite.config.js中进行配置:
import vueJsx from "@vitejs/plugin-vue-jsx";
export default defineConfig({
plugins: [
vue(),
vueJsx()
],
});
3、在vue中使用:
import { ref } from "vue";
export default {
setup() {
const count = ref(100);
return () => <div>count is: {count.value}</div>;
},
};
Ps:script中lang要改成jsx。
以上是编程学习网小编为您介绍的“关于vue3中JSX的使用方法介绍”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:关于vue3中JSX的使用方法介绍


猜你喜欢
- Document.location.href和.replace的区别示例介绍 2024-01-16
- Firefox返回时Iframe的显示Bug的解决方法 2024-03-09
- JS实现点击颜色块切换指定区域背景颜色的方法 2024-03-09
- CSS 使用radial-gradient 实现优惠券样式 2024-02-25
- 关于 css:在 R Shiny 中更改侧边栏菜单项颜色 2022-09-21
- 利用php+mcDropdown实现文件路径可在下拉框选择 2024-02-25
- javascript阻止浏览器后退事件防止误操作清空表单 2024-02-13
- axios基本用法教程示例详解 2023-07-09
- javascript实现点击单选按钮链接转向对应网址的方法 2024-01-14
- CSS中Single Div 绘图技巧的实现 2024-01-04