Vue.js 子组件接收父组件传递的 index 为 undefined 的解决方法

在使用 Vue.js 开发过程中，我们经常会使用 v-for 指令循环渲染子组件，并通过 props 传递数据给子组件。但是，有时我们会遇到子组件接收到的 index 属性为 undefined 的情况。例如：

<MyFlag         v-for='(obj, index) in arr'         :key='index'         :status='obj.isOk'         :index='index'       ></MyFlag>

为什么传到子组件的 index 是 undefined 呢？

可能是因为在子组件中没有声明 props 来接收父组件传递过来的 index 属性。需要在子组件中添加 props 声明：

props: {
  index: {
    type: Number,
    required: true
  }
}

另外，需要确认父组件中 arr 数组中的每个对象都有 isOk 属性，否则会导致传递给子组件的 status 属性也是 undefined。