vue-mount-plugin
v3.1.0
Published
A simple and easy to use vue instance extension plugin that supports vue2.0 and vue3.0
Downloads
44
Maintainers
Readme
vue-mount-plugin
A simple and easy to use vue instance extension plugin that supports vue2.0 and vue3.0
Documentation • Change Log
Installing
# use pnpm
$ pnpm install vue-mount-plugin
# use npm
$ npm install vue-mount-plugin --save
# use yarn
$ yarn add vue-mount-plugin
Usage
Use in Vue >=3.0
<!-- test.vue -->
<script setup>
import { getCurrentInstance } from 'vue'
import Mount from 'vue-mount-plugin'
import DemoVue from './demo.vue'
const { proxy } = getCurrentInstance()
const instance = new Mount(DemoVue, { parent: proxy.$root })
// mount to the end of document.body
instance.mount()
// unmount
instance.unmount()
</script>
Use in Vue 2.7
<!-- test.vue -->
<script>
import { getCurrentInstance } from 'vue'
import Mount from 'vue-mount-plugin'
import DemoVue from './demo.vue'
export default {
setup() {
const { proxy } = getCurrentInstance()
const instance = new Mount(DemoVue, { parent: proxy.$root })
// mount to the end of document.body
instance.mount()
// unmount
instance.unmount()
}
}
</script>
Use in Vue <=2.6
Add
@vue/composition-api
to theproject.json
dependencies and run install.
{
"dependencies": {
"@vue/composition-api": "latest"
}
}
<!-- test.vue -->
<script>
import { getCurrentInstance } from '@vue/composition-api'
import Mount from 'vue-mount-plugin'
import DemoVue from './demo.vue'
export default {
setup() {
const { proxy } = getCurrentInstance()
const instance = new Mount(DemoVue, { parent: proxy.$root })
// mount to the end of document.body
instance.mount()
// unmount
instance.unmount()
}
}
</script>
Import in Browser
Import vue-mount-plugin
through browser HTML tags directly, and use global variable VueMount.
<head>
<!-- Import vue3 or vue2 -->
<script src="//unpkg.com/vue@3"></script>
<!-- Import vue-mount-plugin library -->
<script src="//unpkg.com/[email protected]/dist/index.global.prod.js"></script>
</head>
<!-- test.vue -->
<script>
import { getCurrentInstance } from '@vue/composition-api'
import DemoVue from './demo.vue'
export default {
setup() {
const { proxy } = getCurrentInstance()
const instance = new VueMount(DemoVue, { parent: proxy.$root })
// mount to the end of document.body
instance.mount()
// unmount
instance.unmount()
}
}
</script>
Support & Issues
Please open an issue here.