Fragment For Vue

Provide multi-root support in Vue 2, and able to work in Vue 3.

✨ Comparison with vue-fragment

|Features|fragment-for-vue|vue-fragment| |-|:-:|:-:| |Vue 3|✅|❎| |Vue Devtools|✅|❎| |Directive v-for|✅|❎| |Directive v-if|✅|❎| |TypeScript|✅|✅|

⬇️ Install

npm i -S fragment-for-vue

📃 Usage

In Vue 2

import Vue from 'vue'
import { FragmentPlugin } from 'fragment-for-vue'

Vue.use(FragmentPlugin)

<script>
    import { Fragment } from 'fragment-for-vue'

    export default {
        components: {
            Fragment,
        },
    }
</script>

<template>
    <Fragment>
        <h1>title</h1>
        <Fragment v-for="i in 6" :key="i">
            <p>Num is {{ i }}</p>
        </Fragment>
    </Fragment>
</template>

In Vue 3

- import { Fragment } from 'fragment-for-vue'
+ import { Fragment } from 'fragment-for-vue/vue3'

import Vue from 'vue'
import { FragmentPlugin } from 'fragment-for-vue/vue3'

Vue.use(FragmentPlugin)

☎️ Contact

1. WeChat: ambit_tsai
2. QQ Group: 663286147
3. E-mail: [email protected]