element ui tabs切换标签页数据重置

遇到一个困扰我大半天的问题，切换标签页数据就会重置
如：A标签页 的数据是123，改成456。切换到B标签页再切回来，有会变回123

如果有：
这种错误的话，那就是子组件直接使用了父组件传来的props的值
如：

<template>
  <div>
    <avue-form ref="form"
               v-model="formModel" // 不能直接使用
               :option="formOp5">
    </avue-form>
  </div>
</template>
<script>

export default {
  props: ['formModel'], // 不能直接使用
}
</script>

应该：

<template>
  <div>
    <avue-form ref="form"
               v-model="formData"
               :option="formOp5">
    </avue-form>
  </div>
</template>
<script>

export default {
  props: ['formModel'],
  data() {
    return {
      formData: this.formModel,
    }
  },
  //监听数据，更新数据
  watch: {
    param: {
      handler(val) {
        this.formModel = val
      },
    },
  },
}
</script>