Namespace, Primitive, Method

    vue-react

    1.2.0 • Public • Published

    vue-react

    vue-react is a plugin for Vue.js that allows you to use React components just like if they were Vue components.

    View Demo

    Installation

    npm

    npm install vue-react --save
    

    yarn

    yarn add vue-react
    

    If you dont have already, install react and react-dom packages. Install the babel plugin also.

    npm install react react-dom babel-plugin-transform-react-jsx --save
    

    Add the plugin in your .babelrc file:

    {
        "plugins": ["transform-react-jsx"]
    }

    Usage

    First of all, import and install the plugin:

    import VueReact from 'vue-react';
     
    Vue.use(VueReact);

    After that, import and register your React components using the new react method:

    import ResizableReact from 'react-resizable-box';
     
    Vue.react('Resizable', ResizableReact);

    Use your registered component inside your App as usual Vue component.

    <Resizable className="resizable-item" :width="width" :height="height" @onResizeStop="onStop"></Resizable>

    How it works ?

    The react method creates a new Vue component that maps props and events to the React component. Once mounted, the vue component creates and renders the React component.

    This way the registered component works exactly as a Vue component.

    Further improvements

    • Support for slots.

    Install

    npm i vue-react

    DownloadsWeekly Downloads

    55

    Version

    1.2.0

    License

    MIT

    Unpacked Size

    7.18 MB

    Total Files

    13

    Last publish

    Collaborators

    • alkin