2023-09-15 在Vue中,可以通过使用this.$emit('update-object', newValue)来触发父组件中的update-object事件,并将新的值newValue...

以下是一个示例代码:

父组件:

<template>
  <div>
    <child-component :data="object" @update-object="updateObject"></child-component>
  </div>
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      object: {
        curWveIndex: 1,
        loadingwaveData: false
      }
    }
  },
  methods: {
    updateObject(newValue) {
      this.object = newValue;
    }
  }
}
</script>


子组件:

<template>
  <div>
    <button @click="updateObject">Update Object</button>
  </div>
</template>

<script>
export default {
  props: ['data'],
  methods: {
    updateObject() {
      // 修改object的值
      this.data.curWveIndex = 2;
      this.data.loadingwaveData = true;

      // 触发父组件的update-object事件,并传递新的值
      this.$emit('update-object', this.data);
    }
  }
}
</script>


©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容