Vue中槽的使用_0

个人理解：是组件的扩展。内容通过slotslot传递到组件内部的指定位置，parent和child可以通过slot传递参数；开发背景（出现slot解决什么问题）：一般情况下，helloworld组件标签中的span标签Child会替换为组件模板模板的内容。当要将组件标签Child中的内容传递给组件时，需要使用slotSlot；Slot通俗的理解就是“占一个洞”，在组件模板中占据了很好的位置。使用该组件标签时，组件标签中的内容会自动补洞（替换组件模板中的位置），当槽名为时，使用该属性的元素组件标签中的slot=”mySlot”会替换相应位置的内容；slot标签命名时如下：helloworld会输出：两个红色的helloworld，和一个默认的contentusingslot注意：给slot标签添加样式是无效的，命名的slot不能被不包含slot属性的标签内容替换，默认值为slotslot会显示出来（命名的slot有对应关系）；2.当一个组件中有多个命名的slot时，父组件可以与子组件指定位置显示内容或传递参数，如下：helloworldhelloworld<spanslot="footer">helloworld{{otherData}}3.范围插槽！！:使用时，子组件标签中必须有一个标签，然后通过scopeName.childProp，可以在子组件模板中调用childProp绑定的数据，所以作用域槽为一种子属性从parent传递参数的方法，解决了普通slot无法访问parent中child数据的问题；scopedslots的代表用例是列表组件，它允许在父级父组件上自定义显示列表项，如下所示items所有列表项都可以在插槽定义后传递给父组件，也就是说，数据相同，不同的场景页面可以有不同的展示方式：

插槽的默认内容