pc vue组件传值，父子传值

 

//父级页面
<Agree :isShow="dialogVisible" @checkKey="getCheckBoxType"</Agree>

 

//父级函数部分
//默认弹窗展示，选中都为falae
import Agree from './component/agreement.vue'
const dialogVisible = ref(false)
// 协议选中字段
const checked = ref(false)
//接收父级传值的函数
function getCheckBoxType(checkKey) {
    console.log('checkKey:',checkKey.sonData.checked)
  checked.value = checkKey.sonData.checked
  dialogVisible.value = checkKey.sonData.show
}

//子
<template >
  <el-dialog
      v-model="isDialogShow"
      width="80%"
      center="true"
      custom-class='aaaa'
      title="企业认证信息"
  >
    <div class='content'>
        一些条款一些条款一些条款一些条款一些条款一些条款一些条款一些条款一些条款一些条款一些条款一些条款一些条款一些条款
    </div>
    <template #footer>
      <div class='footer'>
        <el-button @click="enterTrue({checked: true, show: false})" type="primary">确定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

//子接收父级传值
const props = defineProps({
  isShow: {
    default: false,
    type: Boolean
  }
})
const isDialogShow = ref(false)

watchEffect(() => {
  isDialogShow.value = props.isShow

}, [props])

const emit = defineEmits(['checkKey'])
//子往父级回传函数
function enterTrue(val) {
    console.log("***",val)
    let data = {
        sonData: val
    };
    emit('checkKey',data);
}