在表单校验rules时 切换 i18n 国际化语言 校验规则并为随着系统的语言变化而变化;el-select 下拉框中 el-option 中每一项也并为随着系统的语言变化而变化

此时可以通过 控制 router-view 的显示与隐藏,重新渲染路由区域,达到页面刷新的效果

在App.vue中添加以下代码,可以使项目所有表单及下拉框等未被及时更新的页面都及时更新

<template>
  <div>
    <router-view v-if="isActiveRoute" />
  </div>
</template>

<script>
  export default {
    data() {
      return {
        isActiveRoute: true //
      }
    },
    methods: {
      reload() {
        this.isActiveRoute = false;
        this.$nextTick( () => {
          this.isActiveRoute = true;
        })
      }
    },
    watch: {
      '$i18n.locale'(newVal, oldVal) {
        if(newVal !== oldVal) {
          this.reload()
        }
      }
    }
  }
</script>