1# slot插槽<a name="ZH-CN_TOPIC_0000001164290730"></a> 2 3> **说明:** 4>从API Version 7 开始支持。 5 6## 默认插槽<a name="zh-cn_topic_0000001127284840_section68133181214"></a> 7 8自定义组件中通过slot标签来承载父组件中定义的内容,使用slot标签可以更加灵活的控制自定义组件的内容元素,使用方式如下: 9 10``` 11<!-- comp.hml --> 12<div class="item"> 13 <text class="text-style">下面使用父组件定义的内容</text> 14 <slot></slot> 15</div> 16``` 17 18引用该自定义组件方式如下: 19 20``` 21<!-- xxx.hml --> 22 <element name='comp' src='../../common/component/comp.hml'></element> 23 <div class="container"> 24 <comp> 25 <text class="text-style">父组件中定义的内容</text> 26 </comp> 27 </div> 28``` 29 30## 具名插槽<a name="zh-cn_topic_0000001127284840_section18337143291211"></a> 31 32当自定义组件中需要使用多个插槽时,可通过对插槽命名的方式进行区分,当填充插槽内容时,通过声明插槽名称,将内容加到对应的插槽中。 33 34``` 35<!-- comp.hml --> 36<div class="item"> 37 <text class="text-style">下面使用父组件定义的内容</text> 38 <slot name="first"></slot> 39 <slot name="second"></slot> 40</div> 41``` 42 43引用该自定义组件方式如下: 44 45``` 46<!-- xxx.hml --> 47 <element name='comp' src='../../common/component/comp.hml'></element> 48 <div class="container"> 49 <comp> 50 <text class="text-style" slot="second">插入第二个插槽中</text> 51 <text class="text-style" slot="sfirst">插入第一个插槽中</text> 52 </comp> 53 </div> 54``` 55 56> **说明:** 57>name 和 slot 属性不支持绑定动态数据。 58 59