初次在vue中使用jsx

vue 62426 4年前 (2020-05-09) 685次浏览 0个评论 扫描二维码

需求是,要在elementui的 Notification 组件中插入自定义的html

常规使用 createElement 的方式在遇到嵌套多的情况下,很复杂,所以我们直接使用jsx

1.安装

npm install @vue/babel-preset-jsx @vue/babel-helper-vue-jsx-merge-props

2.配置babel

在 .babelrc 文件中加入

"presets": ["@vue/babel-preset-jsx"]

3.使用

一定不要忘了写第一行,还有一点要注意,jsx里面的函数传参一定要写成画线的形式,常规的传参方式会导致函数直接执行。这个是react里面的写法,vue有自己的一套写法,虽然也是借鉴react的,但是之后有时间可以去研究

喜欢 (1)
[支付宝扫码,感谢支持]
分享 (0)
关于作者:

您必须 登录 才能发表评论!