Vue2.0，如何在组件内部获取 prop 呢？始终 undefined

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

› Vue.js

这是一个创建于 2941 天前的主题，其中的信息可能已经有所发展或是发生改变。

组件 A 有一个 prop 属性 id ；

A 组件：

export default{
  props:{
    id:{
      type:String
    }
  },
  mounted:function(){
    console.log(this.id) //始终 undefined
  }
}

组件 B 调用组件 A ，并给 id 传值<a :id="id"></a>

B 组件：

export default{
      data() {
        return {
          id:23
       }
   },
  components:{....}
}

在组件 A 的 mounted 里获取 id ，始终是空的。

组件

export

prop

mounted

7 条回复 • 2016-11-22 19:12:33 +08:00

1mhz

2016-11-22 16:56:14 +08:00 via iPhone

A 组件， id:String 试试

1mhz

2016-11-22 16:57:42 +08:00 via iPhone

也有可能是 mounted 里边要 this.$nextTick 再打印

1mhz

2016-11-22 16:58:55 +08:00 via iPhone

或者你确定 b 组件里 components 包含了 a 组件？

micate

2016-11-22 17:15:50 +08:00

看示例：
https://jsfiddle.net/micate/9s53p7ee/

```
<a :id="id"></a>
```

引号中的 `id` 如果想要直接传递字符串，应该使用单引号引起来；
如果是传递引用，要保证这个引用在父组件中存在，比如是 `data` 中的 key ，或者是计算属性之类的。

akaylh

2016-11-22 19:07:30 +08:00

@1mhz b 组件里是有引用 a 组件的， components 我省略写了

akaylh

2016-11-22 19:08:39 +08:00

我目前暂时是通过 watch 来实现了。

akaylh

2016-11-22 19:12:33 +08:00

@micate 看了您的示例，确实是可以。我的代码里可能是因为 b 组件里 id 也是通过 mounted 来讲求 ajax 赋值的。