vue $scopedSlots 和 $slots 的区别

。。简单来讲 一个是有自己独立的作用域 一个是没有不需要设计变量

还是看代码把

 

// slots对象
export default {
    name: 'list-item',
    props: {
        arr: {
            type: Array,
            default () {
                return []
            }
        }
    },
    render(h, vm) {
        return ( <ul>{
                this.arr.map(item => ( <
                    li > {
                        this.$slots.default || item.name
                    } --- {item.txt}< /li>
                ))
            } </ul>
        )
    }
}


// scopedSlots对象
export default {
    name: 'list-item',
    props: {
        arr: {
            type: Array,
            default () {
                return []
            }
        }
    },
    render(h, vm) {
        return ( <ul>{
                this.arr.map(item => ( 
                    <li> {this.$scopedSlots.default(item)} --- {item.txt}</li>
                ))
            } </ul>
        )
    }
}

 

 

其实就是我们经常看到的slot插槽是不是带有 slot-scope属性 有的话 就是scopedSlots对象 不是就是slots对象