vue父子组件传值失败

Question

项目目录：

index是父组件，add和list是子组件，目的是父组件传列表数据到list里。

index.vue
html部分
<list :eva="evaMsg"></list>

script部分
import List from '@/views/evaluate/list.vue'

export default {
  data () {
    return {
      evaMsg:[
        {
          username:'tom',
          content:'very good'
        },
        {
          username:'jack',
          content:'very bad'
        },
      ],
    }
  },
 components: {
    List
    },
}

子组件
html部分
<p>{{eva}}</p>

script部分

 export default {
  data () {
    return {
      props:{
        eva:{
          type:Array
        }
      }
    }
  }
 }

这么写会报错：eva未定义但是被引用了。

Answer 1

export default {
    // 这里是父组件传过来的数据
    props: {
        eva: {
            type: Array,
            default: function () {
                return []
            }
        }
    },
    // 这里放本组件数据
    data () {
        return {
            msg: ''
        }
    }
}

Answer 2

data里面定义props是什么鬼。。。

Answer 3

props要和data同一个层级：

export default {
  props:{
        eva:{
          type:Array
        }
  },
  data () {
    return {
    }
  }
 }

Answer 4

写法错了，子组件中的props是和data同级别的。
关于父子组件传值，可以参考我的博客，希望对你有帮助~ https://blog.csdn.net/weixin_...