vue中v-for如何将index或item传给子组件

Question

在父组件中使用v-for时想将每个item的id或index传到子组件中使用:获取到的都是undefined
试了:index="{item.id}",:index="item.id"都不行。

<ul class="chart-list menu-margin-before">
                <li v-for="(item,index) in items" class="chart-item" ref="chartList" >{{item.name}}---{{index}}
                    <d3charts :index="item.id" ></d3charts>
                </li>
</ul>

子组件：props却获取不到

props: {
            index: {
                type : Number,
                default: 0
            }
        }

这里向子组件传值：<my-component :index="indexData"></my-component>,只能是DATA(){}里设置的属性吗?

export default{
...
data(){ indexData:1 }
...
}

里定义的才能传吗？

Answer 1

需要确保 items 数组中的元素是对象且有 id 属性