vue2 子组件调用父组件数据并展示，父组件修改了值，子组件怎么没有同步更新？子组件拿到父组件数据使用了get和set，怎么才能触发依赖追踪

当父组件的数据发生变化时，子组件并不会自动更新，这是因为Vue的响应式系统是基于依赖追踪的。当组件渲染时，Vue会追踪组件所依赖的所有数据，并建立一个依赖关系图。当数据发生变化时，Vue会遍历依赖关系图，重新渲染所有依赖的组件。

如果子组件拿到了父组件的数据并使用了get和set，但是没有触发依赖追踪，可能是因为子组件没有正确地使用该数据。在子组件中使用父组件的数据时，应该使用计算属性或者watch来监听该数据的变化，这样才能正确地触发依赖追踪。

另外，如果父组件的数据是异步获取的，可能会出现子组件渲染时数据还未获取到的情况。此时可以使用v-if指令来控制子组件的渲染时机，等到数据获取成功后再渲染子组件。

相关问题

vue2 子组件调用父组件数据并展示，父组件修改了值，子组件怎么没有同步更新？子组件拿到父组件数据使用了get和set

子组件调用父组件数据并展示后，如果父组件修改了该数据，子组件不会同步更新。这是因为Vue的响应式系统是基于依赖追踪的，只有在模板中使用的数据才会被追踪，而子组件中使用的父组件数据并没有在模板中使用，所以不会被追踪。如果想要子组件同步更新父组件数据，可以使用v-model指令或者$emit方法来实现。具体来说，可以在子组件中使用v-model绑定父组件数据，并在子组件中触发input事件来更新父组件数据；或者在子组件中使用$emit方法触发自定义事件，并在父组件中监听该事件来更新数据。如果你使用了get和set方法来获取和设置父组件数据，那么子组件仍然无法同步更新父组件数据，因为这并不会触发依赖追踪。

vue2 父组件的父组件调用子组件数据

在Vue2中，父组件的父组件可以通过`$parent`属性来访问子组件的实例，但是不建议这样做，因为这样会使得组件之间的耦合度过高，不利于组件的复用和维护。更好的做法是通过`props`和`$emit`来实现父子组件之间的通信。

如果需要父组件的父组件调用子组件的数据，可以通过在子组件中定义一个`ref`，然后在父组件的父组件中通过`$refs`来访问子组件的实例，从而获取子组件的数据。具体实现步骤如下：

1.在子组件中定义一个`ref`，例如`childRef`。

<template>
  <div>
    <button @click="childFun">子组件按钮</button>
  </div>
</template>

<script>
export default {
  name: "child",
  data() {
    return {};
  },
  methods: {
    childFun() {
      this.$emit("child-event", "子组件要传达到父组件数据");
    },
  },
};
</script>

<style lang='less' scoped>
</style>

2.在父组件中监听子组件的自定义事件，并将子组件的数据通过`$emit`方法传递给父组件。

<template>
  <div>
    <child ref="childRef" @child-event="handleChildEvent"></child>
  </div>
</template>

<script>
import Child from "./Child.vue";

export default {
  name: "parent",
  components: {
    Child,
  },
  methods: {
    handleChildEvent(data) {
      console.log(data); // 子组件要传达到父组件数据
      console.log(this.$refs.childRef); // 子组件实例
    },
  },
};
</script>

<style lang='less' scoped>
</style>

注意：在父组件中通过`$refs`访问子组件的实例时，需要等到子组件渲染完成后才能访问，否则会返回`undefined`。可以在父组件的`mounted`钩子函数中访问子组件的实例。