Vue Slot v-for 传递参数到子组件

如果帮助到您，请轻点【喜欢】

<div id="wrapper">
    <parent :list="list">
        <template scope="props">
            <child :data="props.rowdata"></child>
        </template>
    </parent>
</div>

Vue.component('parent', {
    props: ["list"],
    template: `
        <ul>
            <div>title{{list.length}}</div>
            <slot v-for="item in list" :rowdata="item">
            </slot>
        </ul>
    `
})

Vue.component('child', {
    props: ["data"],
    template: `
        <li >
            {{data}}
        </li>
    `
})

new Vue({
    el: '#wrapper',
    data: function () {
        return {
            list: [{
                    a: 1,
                    b: 2
                },
                {
                    a: 1,
                    b: 2
                },
            ]
        }
    },
})

大前端知识库收集分享 www.rjxgc.com 壹玖零Tech
搜罗各种前后端奇淫技巧，花式编程思想，日日更新，速来围观吧...