FormItem.vue

<template>
  <el-form-item
    :label="getL18nLabel()"
    :prop="prop"
    v-bind="$attrs"
    v-on="$listeners"
  >
    <c-highlight-content
      :id="previewLabel || label || prop"
      :path="preProp ? preProp + '.' + prop : prop"
      v-if="prop"
    >
      <slot></slot>
    </c-highlight-content>
    <slot v-else></slot>
  </el-form-item>
</template>

<script>
export default {
  props: ["label", "prop", "previewLabel", "preProp"],
  methods: {
    getL18nLabel() {
      if (!this.label || this.label.trim() === "") {
        return "";
      }
      // 默认中文作 key
      if (this.$store.state.I18n.lang === "zh") {
        return this.label;
      }
      let vm = this,
        root = null;
      while (true) {
        if (vm.root) {
          root = vm.root;
          break;
        }
        if (vm.$vnode.componentOptions.tag === "el-form") {
          break;
        }
        vm = vm.$parent;
      }
      //  若找到了root，表明该form-item是在交易下的
      if (root) {
        const opts = root.$vnode.componentOptions
        const name = opts.Ctor.options.name || opts.tag
        // const key = `tx.${root.trnName}.${this.label}`;
        const key = `tx.${name}.${this.label}`;
        const tVal = this.$t(key);
        return tVal === key ? this.label : tVal;
      }
      return this.label;
    },
  },
};
</script>

<style></style>