vue插槽的使用

1.默认插槽:子组件留一个slot位置,父组件引用时候可以使用任意标签填入。

  子组件:

  父组件使用时:

 

2.具名插槽:根据名字匹配显示对应的插槽,不使用默认

  子组件:

 

  父组件使用:

3.作用域插槽:上面的两种插槽展示的数据, 都是放在插槽的使用者 About组件的data中的,但是我们有时候, 使用者是不管这些数据的, 数据中从catetory 组件中自已获取的,

使用者 About 只需要来管理 插槽中的内容的展现形式。使用作用域插槽可以进行插槽子组件到父组件之间的传值。

  子组件:

  父组件:使用template的用scope进行传值,没有使用的用slot-scope进行传值

https://www.jb51.net/article/225620.htm

posted on 2022-07-15 15:41  ChoZ  阅读(341)  评论(0编辑  收藏  举报

导航