## 一：访问根实例 `this.$root`
在每个`new Vue`实例的子组件中，其根实例可以通过`$root`属性进行访问。例如，在这个根实例中：
~~~
// Vue 根实例
new Vue({
data: {
foo: 1
},
computed: {
bar: function () { /* ... */ }
},
methods: {
baz: function () { /* ... */ }
}
})
~~~
所有的子组件都可以将这个实例作为一个全局 store 来访问或使用。
~~~
// 获取根组件的数据
this.$root.foo
// 写入根组件的数据
this.$root.foo = 2
// 访问根组件的计算属性
this.$root.bar
// 调用根组件的方法
this.$root.baz()
~~~
## 二：访问父组件实例 `this.$parent`
```
<google-map>
<google-map-markers v-bind:places="iceCreamShops"></google-map-markers>
</google-map>
```
在`google-map-markers`组件中就可以使用`this.$parent`访问`google-map`组件。
但是当子组件很多的情况下 ，代码就很容易变得很长：
var map = this.$parent.map || this.$parent.$parent.map
## 三：访问子组件实例 `ref`(类似Angular的模版引用变量)
可以通过`ref`特性为这个子组件赋予一个 ID 引用。例如：
```
<base-input ref="usernameInput"></base-input>
```
现在在你已经定义了这个`ref`的组件里，就可以使用：
~~~
this.$refs.usernameInput //base-input组件的实例
~~~
