react组件集成到vue框架(Vuera的使用)

最近项目中有须要把react组件集成到vue框架中,本身研究了一下,最终实现了。有人会比较好奇为何要这么作,主要是由于项目工期比较赶,若是本身开发这个功能最少须要半年的时间,因此找了三方组件集成进来,最后调研的组件中最符合业务需求的组件是使用react写的。vue

首先是调研了一下网上的解决方案,最后定下来使用Vuera三方插件来集成react,直接上代码:react

 

 1 <template>
 2 <div id="root">
 3   <component :is="videoPlayer" ></component>
 4 </div>
 5 </template>
 6 <script>
 7 import { ReactInVue } from 'vuera';
 8 import AnnotationPageContainer from './cvat-ui/containers/annotation-page/annotation-page';//react组件所在的开始页面
 9 
10 export default {
11     components: { player: ReactInVue(AnnotationPageContainer)},
12     data () {
13         return{
14           videoPlayer: "player",
15         }
16     },
17 }18 <script>
相关文章
相关标签/搜索