Vue.js道具未定义

时间:2020-02-25 17:55:34

标签: vue.js vue-component vue-props

执行此代码时,输​​出“ undefined”。


子组件

export default {
  porps: [
    'idx'
  ],
  mounted () {
      console.log(this.idx)
  },
} //BambooPage.vue

父项

<template>
  <div class="bamboo">
    <bamboo-page v-bind:idx="index" v-if="show"></bamboo-page>
  </div>
</template>

<script>
import BambooPage from '@/components/Bamboo/Page/BambooPage.vue'
export default {
  name: 'bamboo',
  data: () => {
    return {
      show: false,
      index: 0
    }
  },
  components: {
    BambooPage
  },
  mounted () {
      this.index = 5
      this.show = true
  },
}
</script>

在Vue Devtools上,子组件中有$ attars“ idx:5”。
我该怎么办?

1 个答案:

答案 0 :(得分:1)

您在文字道具中有错字) 猪: 'idx' ]

更改道具