栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > 后端开发 > Java

vue--插槽

Java 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

vue--插槽

Vue---------------------------------vue框架为大对象,相当与主启动
Vue.components--------------------------------相当于java类,为各个小弟,万物皆组件
Vue---------------------------------插槽,功能是可以将组件中的小模块分出来,组件里面可以插入另一个组件,通过插槽来实现;符合解耦合原理,相当与java中的接口

参考:https://cn.vuejs.org/v2/guide/components-slots.html
代码演示:




    
    Title




结果:

Vue.component(“todo”,{
template:







});
Vue.component(“todo-title”,{
props: [‘title’],
template: ‘ {{title}} ’
});
Vue.component(“todo-items”,{
props: [‘item’],
template: ‘

{{item}}’
});
分析:
第一个组件相当与主启动,它调用了插槽todo-title和todo-items
第二个和第三个组件就是实现插槽todo-title和todo-items组件,自己是组件,但被其他组件调用时候是通过插槽实现的

然后页面层:



    
    

div里面是直接套的组件一,也就是自定义的标签todo,然后将组件二三以插槽的方式在页面上被todo包住,就会自动被调用他们的第一个组件以插槽方式,插入相对应的地方!!!

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/711592.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号