vue3个人心得---功能详解（七）父传子 props

父传子 props

子可以通过defineExpose({})暴露要向父传递的变量、函数、DOM，父通过给子组件加ref属性，通过"ref值.value.子变量"语句来操作子传过来的变量、函数、DOM,且父子间的值是双向绑定的。
那么父怎么向子传递变量、函数、DOM:
1、通通放在子组件标签里
把要传给子的变量、函数、DOM或字符数字等,以子组件的属性形式放在标签里。如下:

注意:传递变量、函数、DOM时,要带响应绑定指令(v-bind)的形式。如是传递标签的原生属性或字符时,不需要v-bind指令.
2、在子组件内用defineProps([])先注册
子组件使用父传递的值前需要先用defineProps([])注册,如下:

注意写法:所要传进来的值放在[]中括号里.且值要加引号.
3、模板部与逻辑部的不同用法
在模板部直接使用defineProps后的值就行
逻辑部不能直接使用defineProps后的值,需将defineProps赋值给一个变量,传进来的值以这个变量的属性的形式来使用.
4、单向绑定与可读
因子对父传过来的值只可读不可写,所以是单向绑定,子响应父的改变,子无权改变传过来的值.
如上,子对wee.ioo赋值会跳出wee.ioo非可写警告.
5、函数的使用要加()括号
defineProps后的函数类值,使用时要加()号,不能的话只是个函数样式,不会运行函数,如上idd函数不加()不会运行函数.

2B的emit监听事件

明天再写