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的使用方法介绍


基础教程推荐
猜你喜欢
- 前端vue按1920*1080设计图的页面适配屏幕缩放并适配4K屏详解 2023-12-21
- IE7 float:left左浮动失效的解决方法 2024-01-25
- css滤镜基础教程 2024-01-24
- php-删除插入到mysql中的post html,js,css 2023-10-26
- vue中mixins的使用方法和注意点 2023-10-08
- Firefox返回时Iframe的显示Bug的解决方法 2024-03-09
- 关于微信浏览器H5 React,Vue工程化项目input无法自动聚焦疑难杂症排查 2023-10-08
- CSS设置列表样式和创建导航菜单实现代码 2023-12-28
- CSS3中currentColor关键字的妙用 2024-02-04
- AJAX实现无刷新检测用户名功能 2023-02-13