Vue【从无到有从有到无】【F1】大话插槽

  直接上干货

//slot组件,自己实现的插槽,可以想象的比喻成【插座】


//slot的子组件,要插入插槽的内容;可以形象的比喻成【插销】


页面渲染效果

Vue【从无到有从有到无】【F1】大话插槽_第1张图片

【小结】插销 插在 插座 上,其他的都插不进去

在slot组件中引入了slot的子组件,而且又在子组件标签内添加了新的标签内容,但页面上并没有将子组件标签内的标签内容显示出来,所以说在不适用slot的情况下,在子组件标签内添加Dom是无效的;


我们再进一步深入了解一下



效果图入下

Vue【从无到有从有到无】【F1】大话插槽_第2张图片

【小结】

将插槽内的插销插到了 上,不影响其他的东西的正常形态;

使用slot后可以在子组件内显示插入的新标签内;

 

你可能感兴趣的:(Vue)