vue如何使用反应组件

这篇文章主要介绍vue如何使用反应组件,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

vue使用反应组件的方法:首先安装依赖,然后编辑【主要。js】,最后加入需要引用的反应组件,代码为【从& # 39;进口MyReactComponent。/MyReactComponent& # 39;】。

<强> vue使用反应组件的方法:

<强> 1。安装依赖

npm 小姐:-S  vuera 　　npm  install ,,节省react  react-dom

<强> 2。编辑主要。js:

import  {, VuePlugin },得到& # 39;vuera& # 39; Vue.use (VuePlugin)

<强> 3。加入需要引用的反应组件

import  MyReactComponent 得到& # 39;。/MyReactComponent& # 39;

这个时候发现第一个问题:

不难发现,这是vue项目中未jsx文件格式的问题所导致

解决办法:

编辑webpack.base.conf。js,加入对jsx的支持

测试:/\。(js | jsx) (\ ?。*) ?美元/

这个时候第二个问题出现了:

原因:

。babelrc文件中默认引入了transform-vue-jsx,此插件将jsx转义成h函数的形式供vue调用。

解决办法:

npm  install ——save-dev  babel-plugin-transform-react-jsx

并且在。babelrc文件中

用<代码> transform-react-jsx> transform-vue-jsx

以上是“vue如何使用反应组件”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注行业资讯频道!

vue如何使用反应组件