el-tabs嵌套el-form碰到的问题

el-form无法全部校验

在el-tabs内使用el-form时，会出现标签第一个内的el-form在点击保存按钮后，无法进行全部校验

<template>
  <div class="app-container">
    <Tabs :list="state.tabList" @handle-tab-change="tabChange">
      <div class="add-container">
        <div class="deviceInfo">
          <Form :settings="key.indexOf('单灯') > -1 ? state.ddsettings : state.ldsettings" ref="form"
            v-model="state.formData" :key="key">
          </Form>
        </div>
        <div class="configInfo">
          <div class="title" v-if="key.indexOf('单灯') > -1">参数配数</div>
          <parameter-card :config-uration="deviceData.jzkzq.configUration" v-model="state.configData"
            v-if="key.indexOf('单灯') > -1" @change="changePar"></parameter-card>
        </div>
        <div class="button">
          <el-button color="#165DFF" @click="save">保存</el-button>
          <el-button color="#F2F3F8" @click="cancel">取消</el-button>
        </div>
      </div>
    </Tabs>
  </div>
</template>

对于这个问题，目前也没找到原因以及一个好的解决办法，好在通过将tabs内的内容移到外部来，解决了这一问题。

<template>
  <div class="app-container">
    <Tabs :list="state.tabList" @handle-tab-change="tabChange">
    </Tabs>
    <div class="add-container">
      <div class="deviceInfo">
        <Form :settings="key.indexOf('单灯') > -1 ? state.ddsettings : state.ldsettings" ref="form" v-model="state.formData"
          :key="key">
        </Form>
      </div>
      <div class="configInfo">
        <div class="title" v-if="key.indexOf('单灯') > -1">参数配数</div>
        <parameter-card :config-uration="deviceData.jzkzq.configUration" v-model="state.configData"
          v-if="key.indexOf('单灯') > -1" @change="changePar"></parameter-card>
      </div>
      <div class="button">
        <el-button color="#165DFF" @click="save">保存</el-button>
        <el-button color="#F2F3F8" @click="cancel">取消</el-button>
      </div>
    </div>
  </div>
</template>

当然，对于切换标签，可能会出现校验的红字还在，并没有清空的情况，这是因为使用的Form组件是同一dom，想要清空的校验的话，最简单的方法就是加一个key属性，:key=“key”，tabChange改变了key之后，编译器就会重新渲染Form组件，这样就达到了清空校验的目的！

const tabChange = (val) => {
  key.value = val
  judgeSaveApi()
}