最近在看《Vue.js》实战这本书,遇到了一段关于深度复制slot的代码,按照书敲了一遍,报错。然后反复检查和上网查了资料,还是不知道错在哪?希望哪位大神能帮忙看看。感谢。<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/vue.js"></script>
</head>
<body>
<div id="app">
<ele>
<div>
<Child></Child>
</div>
</ele>
</div>
<script>
Vue.component('Child',{
render:function(createElement){
return createElement('p','text');
}
});
Vue.component('ele',{
render:function(createElement){
//克隆slot节点的方法
function cloneVNode(vnode){
//递归遍历所有子节点,并克隆
const clonedChildren = vnode.children && vnode.children.map(function(vnode){
return cloneVNode(vnode);
});
const cloned = createElement(
vnode.tag,
vnode.data,
clonedChildren
);
cloned.text = vnode.text;
cloned.isComment = vnode.isComment;
cloned.componentOptions = vnode.ComponentOptions;
cloned.elm = vnode.elm;
cloned.context = vnode.context;
cloned.ns = vnode.ns;
cloned.isStatic = vnode.isStatic;
cloned.key = vnode.key;
return cloned;
}
const vNodes = this.$slots.default;
const clonedVNodes = vNodes.map(function(vnode){
return cloneVNode(vnode);
});
return createElement('div',[
vNodes,
clonedVNodes
]);
}
});
var app = new Vue({
el:'#app'
})
</script>
</body>
</html>
添加回答
举报
0/150
提交
取消