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對象