问题：页面记录结束后，tags组件不恢复默认状态，必须手动点击取消。

**尝试1：**在Money.vue组件里声明一个生成空记录的函数，然后在get recordList里面调用函数

结果，发现还是不行，Tag组件没有做同步，需要想办法通知Tag组件，让Tag组件自己重置

尝试2: 经过询问得出可以考虑用eventBus（可以搜vue2事件路线或者vue2 eventBus）

vue2: eventBus

还有一个方法就是直接用浏览器提供的自定义事件，在tag组件的mounted回调里监听自定义事件 document.addEventListener("resetTags", () => this.selectedTags = [])

money组件里在提交后执行document.dispatchEvent(new CustomEvent("resetTags"))

自定义事件

最终代码：

Tags.vue

<script lang="ts">
import Vue from "vue";
import { Component, Prop } from "vue-property-decorator";
import { mixins } from "vue-class-component";
import TagHelper from "@/mixins/TagHelper";
@Component
export default class Tags extends mixins(TagHelper) {
  selectedTags: string[] = [];
  get tagList() {
    return this.$store.state.tagList;
  }
  created() {
    this.$store.commit("fetchTags");
  }
  mounted() {
    document.addEventListener("resetTags", () => (this.selectedTags = []));
  } //回调
  toggle(tag: string) {
    const index = this.selectedTags.indexOf(tag);
    if (index >= 0) {
      this.selectedTags.splice(index, 1);
    } else {
      this.selectedTags.push(tag);
    }
    this.$emit("update:value", this.selectedTags);
  }
}
</script>

Money.vue

<script lang="ts">
import Vue from "vue";
import NumberPad from "@/components/Money/NumberPad.vue";
import FormItem from "@/components/Money/FormItem.vue";
import Tags from "@/components/Money/Tags.vue";
import { Component } from "vue-property-decorator";
import Tabs from "@/components/Tabs.vue";
import recordTypeList from "@/constants/recordTypeList";

const generateNewItem = () => ({
  tags: [],
  notes: "",
  type: "-",
  amount: 0,
  createdAt: new Date().toISOString(),
});
@Component({
  components: { Tabs, Tags, FormItem, NumberPad },
})
export default class Money extends Vue {
  get recordList() {
    return this.$store.state.recordList;
  }
  recordTypeList = recordTypeList;
  record: RecordItem = generateNewItem();

  created() {
    this.$store.commit("fetchRecords");
  }
  onUpdateNotes(value: string) {
    this.record.notes = value;
  }
  saveRecord() {
    if (!this.record.tags || this.record.tags.length === 0) {
      return window.alert("请至少选择一个标签");
    }
    this.$store.commit("createRecord", this.record);
    if (this.$store.state.createRecordError === null) {
      window.alert("已保存");
      document.dispatchEvent(new CustomEvent("resetTags"));
      this.record = generateNewItem();
    }
  }
}
</script>