Vue.js特性ScopedSlots的示例分析-创新互联
这篇文章主要介绍Vue.js特性Scoped Slots的示例分析，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！
成都创新互联公司专注于陵川网站建设服务及定制，我们拥有丰富的企业做网站经验。 热诚为您提供陵川营销型网站建设，陵川网站制作、陵川网页设计、陵川网站官网定制、
小程序设计服务，打造陵川网络公司原创品牌,更为您提供
陵川网站排名全网营销落地服务。
什么是scoped slots
A scoped slot is a special type of slot that functions as a reusable template (that can be passed data to) instead of already-rendered-elements.
上面是官方的定义。
作用域插槽（Scoped Slots）是vue.js中一个非常有用的特性，它可以使组件更加通用和复用。唯一的问题是理解起来比较困难。试图去让你理解父与子作用域的交织关系，像解决一道数学难题。
简单点说slot就是插槽，它是可以被替换掉的，替换它的内容是可以拿到当前组件的上下文的
举个简单的例子
//button.vue
//相当于是占位
//app.vue
slot其实就是一个占位，button.vue的slot位置会被app.vue里面的替换了。
复杂例子1：slot内的东西可以获取父组件的上下文信息
//list.vue
//这里是slot的占位
//app.vue
//这里可以获取到item，item原本是属于List组件内部的。也就是说slot获取了父组件的上下文。
{{row.item.text}}
解释见上面代码注释。注意一点的是slot-scope=”row” 这里的名字(row)是可以任意取的。
named slots
可以直接放到普通标签上面，可以放template标签上
slot里面的作用域是普通标签或者template是一致的。不能访问父组件的作用域。
复杂例子2：slot里面是可以放东西的，是默认的模板，可被替换。
//table.vue
//这里定义了一个slot，名字叫columns，也就是说这里的内容是可以被替换掉的
{{column}}
//这里slot有一个prop是row
{{itemValue(item, column)}}
//app.vue
