脚本宝典收集整理的这篇文章主要介绍了vue怎么用react组件,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
vue使用react组件的方法:首先安装依赖;然后编辑【main.js】;最后加入需要引用的react组件,代码为【import MyReactcomponent From './MyReactComponent'】。
【相关文章推荐:vue.js】
@H_512_13@vue使用react组件的方法:
1. 安装依赖
npm i -s vuera npm install --save react react-dom
2. 编辑main.js:
import { VuePlugin } from 'vuera'Vue.use(VuePlugin)
3. 加入需要引用的react组件
import MyReactComponent from './MyReactComponent'
这个时候发现第一个问题:
不难发现,这是vue项目中未jsx文件格式的问题所导致
解决办法:
编辑webpack.base.conf.js,加入对jsx的支持
test: /\.(js|jsx)(\?.*)?$/
这个时候第二个问题出现了:
原因:
.babelrc文件中默认引入了transform-vue-jsx,此插件将jsx转义成h function的形式供vue调用。
解决办法:
npm install --save-dev babel-plugin-transform-react-jsx
并且在.babelrc文件中
用transform-react-jsx
替换transform-vue-jsx
相关免费学习推荐:JavaScript(视频)
以上就是vue怎么用react组件的详细内容,更多请关注脚本宝典其它相关文章!
以上是脚本宝典为你收集整理的vue怎么用react组件全部内容,希望文章能够帮你解决vue怎么用react组件所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。