这次给大家带来为什么slot都是用在子组件,使用slot子组件的注意事项有哪些,下面就是实战案例,一起来看一下。
使用slot场景一:
子组件Minput.vue
父组件 Minput
可以显示吗
这种情况下 Minput标签内的文字是不会渲染出来的
如果现在想在里面把文字渲染出来怎么办
好 用slot
子组件
这样的话,父组件的里面的文字就可以渲染出来
场景二:具名插槽
子组件 he.vue
父组件
hello world
渲染出来的结果就是
hello world
场景三
子组件 child
这是h1
这是分发内容,只有在没有分发内容的情况下显示
父组件
这是一段p
SOPHP免费微信开源框架下载SOPHP是一款稳定开源的微信公众平台开发系统,也是基于weiphp开发的第一款商业系统。依托自身强大的钩子功能,她可以帮助大家快速开发出自己想要的微信功能插件,运营近两年来我们收获了上千用户与良好的口碑。作为一个开源产品,希望大家都能参与进来为SOPHP添砖加瓦,SOPHP团队一直都在致力于让SOPHP更加优秀。
两段p
渲染出来就是
这是h1
这是一段p
两段p
如果父组件
那么渲染出来的就是
这是h1
这是分发内容,只有在没有分发内容的情况下显示
场景四:作用域插槽
父组件
hello from parent {{ props.text }}
x渲染的话就是
hello from parent hello from child
相信看了这些案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
相关阅读:










