如果把vue组件动态添加到body上？

tools.js:

import Vue from 'vue' /** * @param Component 组件实例的选项对象 * @param props 组件实例中的prop */export function create(Component, props) {const comp = new (Vue.extend(Component))({ propsData: props }).$mount() document.body.appendChild(comp.$el) comp.remove = () => {document.body.removeChild(comp.$el) comp.$destroy()} return comp}

App.js:

添加import { Feedback } from './feedback'import { Button } from 'element-ui'import { create } from './tools'import './index.css'let feebackexport default {name: 'App',data() {return {}},components: {[Button.name]: Button,Feedback,},mounted() {this.handleAdd()},methods: {handleAdd() {if (feeback) {feeback.remove()}feeback = create(Feedback)},handleInit() {let node = document.getElementById('m-feedback')if (node) {node.parentNode.removeChild(node)}let newElement = document.createElement('div')newElement.id = 'm-feedback'newElement.innerHTML = 'Hello World'document.body.appendChild(newElement)},},}

我开发的chatgpt项目：

https://chat.xutongbao.top/