一个页面中有很多表单，我将各表单拆分为若干组件

<form1component ref="form1component" :data="formData"></form1component>
<form2component ref="form2component" :data="formData"></form2component>
<form3component ref="form3component" :data="formData"></form3component>

父组件将初始数据formData传入，我需要拿到各个子组件填写的form表单数据，并对它们进行校验，再在父组件提交，this.$refs 取数据是好的方法吗？
感觉这样写不太优雅

save () {
 const form1Data = this.$refs.form1component.form1Data
 const form2Data = this.$refs.form2component.form2Data
 const form3Data = this.$refs.form3component.form3Data
 const form1 = this.$refs.form1component.$refs.form1
 const form2 = this.$refs.form2component.$refs.form2
 const form3 = this.$refs.form3component.$refs.form3
 var ok1 = form1.validate()
 var ok2 = form2.validate()
 var ok3 = form3.validate()
 if(ok1 && ok2 && ok3)
  http.post(...form1Data,...form2Data,...form3Data)
}