扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
这篇文章主要介绍Vue作用域插槽的示例分析，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！
作用域插槽不是那么直观的一个概念。Vue文档使用了一段描述性的话来解释作用域插槽：
有的时候你希望提供的组件带有一个可从子组件获取数据的可复用的插槽
……
但是在我们应用的某些部分，我们希望每个独立的待办项渲染出和 todo.text 不太一样的东西。这也是作用域插槽的用武之地。
但在我看来，至少是第一次读到的时候，这段话相当不好理解。插槽不是分发内容到子组件吗，为什么还要从子组件中获取数据？不是已经有了通过emit事件的方法从子组件向父组件传递数据吗，为什么需要它？作用域插槽到底是来干嘛的？……
在浏览了不少博客、自己思考“如果不这么做，就会怎么样”再动手实践之后，作用域插槽的含义才逐渐明了。其实作用域插槽提供了一种封装可复用组件的新思路。下面我会从最简单的例子开始。
简单的展示列表
现在我们做一个纯展示用途的列表组件，如下图所示：
第一个例子先用slot来分发内容