Reference one vue page to another vue page

I introduced another A.vue page in a B.vue page. Now click the method in A to adjust the method in B (with a form)
this is the form
< el-form: model= "dialogForm.data" >

of A.
      <el-row>
        <el-input type="hidden" v-model="dialogForm.data.id" placeholder="ID" auto-complete="off"></el-input>
        <el-col :span="14">
          <el-form-item label=":" :label-width="dialogForm.formLabelWidth">
            <el-input v-model="dialogForm.data.name" placeholder="" auto-complete="off"></el-input>

          </el-form-item>
        </el-col>
        <leave></leave>
        <el-button-group style="float: right">
          <el-button @click="dialogForm.show = false"> </el-button>
          <el-button type="primary" @click="handleSubmit(dialogForm.data)">  </el-button>
        </el-button-group>
      </el-row>
    </el-form>
    B
    import leave from "../formdesign/leave"
    
   A / 
handleSubmit(formData) {
  this.leaveHandleSubmit(leave.leaveDialog.formData)
  **Bleave.leaveDialog.formData**
  
  
    ajaxWork.startWork(formData)
      .then(rs => {
        this.dialogForm.show = false
        this.$message({
          message: "",
          type: "success"
        })
      })
      .catch(error => {
         this.$err(error.msg);
      })
}
   
Feb.27,2021

set ref to build B

<leave ref="componentB"></leave>

then call

in the click method
// $refskB
this.$refs.componentB.leaveDialog**
Menu