溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹vue如何使用react組件，文中介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們一定要看完！
vue使用react組件的方法：首先安裝依賴；然后編輯【main.js】；最后加入需要引用的react組件，代碼為【import MyReactComponent from './MyReactComponent'】。
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'
這個時候發(fā)現(xiàn)第一個問題：
不難發(fā)現(xiàn)，這是vue項目中未jsx文件格式的問題所導(dǎo)致
解決辦法：
編輯webpack.base.conf.js，加入對jsx的支持
test: /\.(js|jsx)(\?.*)?$/
這個時候第二個問題出現(xiàn)了：
原因：
.babelrc文件中默認(rèn)引入了transform-vue-jsx，此插件將jsx轉(zhuǎn)義成h function的形式供vue調(diào)用。
解決辦法：
npm install --save-dev babel-plugin-transform-react-jsx
并且在.babelrc文件中
用transform-react-jsx替換transform-vue-jsx
以上是“vue如何使用react組件”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對大家有幫助，更多相關(guān)知識，歡迎關(guān)注億速云行業(yè)資訊頻道！
免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。
億速云公眾號
手機(jī)網(wǎng)站二維碼