父组件子组件传递值问题

Question

父组件:api是请求的url，改变refresh(子组件中监听这个值，变化了就重新请求)即可重新请求

<el-dialog>
    <page-table
        checkBox
        pagination
        :api="handleListApi"
        :refresh="handleInfo.refresh"
        :data.sync="handleInfo.data"
        :query="handleFilterInfo.query"
        :list-type-info="listTypeInfo"
        :init-curpage="handleInfo.initCurpage"
        :field-list="handleInfo.fieldList"
        :handle="handleInfo.handle"
        @handleEvent="handlePersonEvent"
        @handleClick="handleClick"
      />
</el-dialog>

js部分代码:

handleInfo:{
        refresh:1,
        initCurpage:1,
        data:[],
        fieldList:[
          {label:'姓名',value:'personName',minWidth:150,tooltip:true},
          {label:'人员编号',value:'personCode',minWidth:150,tooltip:true},
          {label:'身份证号',value:'idCardNumber',minWidth:150,tooltip:true},
        ]
      },
      handleFilterInfo:{
        query:{
          deviceIds:[],
          personName:'',
          personCode:'',
          idCardNumber:'',
        },
        list:[
          {type:'input',label:'姓名',value:'personName',hideLabel:true},
          {type:'input',label:'人员编号',value:'personCode',hideLabel:true},
          {type:'input',label:'身份证号',value:'idCardNumber',hideLabel:true},
          {type:'button',label:'查询',btType:'submit',icon:'',event:'searchPerson',show:true},
        ]
      },

然后在子组件中进行一系列的操作。
问题：我在页面中选中表格数据后，点击按钮(改变refresh值)，将选中的值传到dialog中，第一次dialog中的表格没有数据，第二次点击按钮时，才有值，不知道咋搞了

Answer 1

解决方法:在点击按钮将visible设置为true后，在$nextTick()里面修改refresh的值

Answer 2

如果你使用watch监听refresh值变化，可以设置immediate第一次页面渲染就触发，不管有没有数值；

watch: { 
    person: {
        handler(n,o){
            this.person.fullname = n.firstname + ‘ ‘ + this.person.lastname;
        }
        immediate: true, //刷新加载 立马触发一次handler
        deep: true // 可以深度检测到 person 对象的属性值的变
    }
}