antdv之指定input框内容大写

html部分

<template>
  <keep-alive>
    <router-view v-if="$route.meta.subPage" />
    <a-row>
      <a-col :span="24">
        <a-form-model ref="form" :model="formTab" layout="inline">
          <a-row :gutter="10">
            <a-col :span="6">
              <a-form-model-item label="箱号">
                <a-input v-model.trim="formTab.containerNo" />
              </a-form-model-item>
            </a-col>
            <a-col :span="6" v-if="formTab.lockType === '2'">
              <a-form-model-item label="箱号段">
                <a-input v-model.trim="formTab.containerNoStart" style="width:48%;" />
                <span style="display:inline-block;width:4%;text-align:center;">-</span>
                <a-input v-model.trim="formTab.containerNoEnd" style="width:48%;" />
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-col>
    </a-row>
  </keep-alive>
</template>

js部分

<script>
export default {
  data() {
    return {
      formTab: {
        containerNo: '',
        containerNoStart: ''
      }
    }
  },
  // 使model框内容大写
  watch: {
    'formTab.containerNo': {
      deep: true,
      handler: function(newV, oldV) {
        if (newV) {
          this.formTab.containerNo = this.formTab.containerNo.toUpperCase()
        }
      }
    },
    'formTab.containerNoStart': {
      deep: true,
      handler: function(newV, oldV) {
        if (newV) {
          this.formTab.containerNoStart = this.formTab.containerNoStart.toUpperCase()
        }
      }
    }
  },
  methods: {}
}
</script>