
vue.js 2 vnode数组插入到指定元素下的两种解决方案
对于问题1:
解决方案1
import Vue from "vue";
import nodeRenderer from "./RenderNode";
const DetailConstructor = Vue.extend(nodeRenderer);
export default {
props: {
fullText: "",
},
mounted() {
// 参考 https://stackoverflow.com/a/50937178/3089701
const detailRenderer = new DetailConstructor({
propsData: {
node: this.$slots.default,
},
});
console.log(detailRenderer.$mount(), detailRenderer.$el.outerHTML); // $el是dom对象,任意操作
},
};对应RenderNode.js:
export default {
props: ["node"],
render(h, context) {
return this.node ? this.node : "";
},
};解决方案2
立即学习“前端免费学习笔记(深入)”;
const slot = this.$slots.default[0]; console.log(slot.context.$mount(), slot.context.$el.innerHTML);
对于问题2:拿到DOM后,可以进行任意操作。










