vue （form-create）监听异步数组并提交查询问题

Question

我用的是form-create表单组件，查询条件通过json加载显示。地址：http://form-create.com/v2/gui...

问题：
1、监听rule数组（查询条件json），因为考虑到网络性能等方面。初始化页面查询json加载完后再执行this.onSubmit()方法

watch: {
 rule: {
  handler(newValue, oldValue) {
    let ruleLenght = oldValue.length
    if (ruleLenght > 0) {
      this.onSubmit()
    }
  }
 }
},

2、onSubmit方法中打印查询条件formData为空。

 页面：
 <form-create :rule="rule" v-model="fApi" :option="options" />
 
 数据：
 data() {
   return {
     rule: []  //这里值是初始化获取json传给this.rule
   }
 }
 
 方法：
 onSubmit() {
  this.fApi.submit((formData) => {
    console.log(formData)
    let searchForm = JSON.stringify(formData)
    })
 }

后来我设置一个setTimeout就能获取到了，这是为什么啊？上面监听已经获取到数据长度。

setTimeout(()=>{this.onSubmit()},100)