插槽里的内容是不是被命名之后，在子组件里直接用slot，不会显示所有插值
来源：4-11 在Vue中使用插槽
慕函数4234673
2020-05-21 17:16:37
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="Vue.js"></script>
</head>
<body>
<div id="dd">
<item>
<h1 slot="header">header</h1>
<p slot="footer">footer</p>
<h3>ty</h3>
<p>数字</p>
</item>
</div>
<script type="text/javascript">
Vue.component("item",{
template:`<div>
<slot name="header"></slot>
<p>center</p>
<slot name="footer"></slot>
<slot></slot>
</div>`
})
new Vue({
el:"#dd"
})
</script>
</body>
</html>
写回答
1回答
-
好帮手慕夭夭
2020-05-21
同学你好，没错的。如果插槽已经设置了名字，就会根据名字显示对应的内容。例如插槽名为header，那么显对应显示 slot="header"相关的内容。
如果没有为插槽设置名称，那么就会显示默认的内容，即如下：
如果我的回答帮助到了你，欢迎采纳，祝学习愉快~
0
相似问题