目录

1.defineProps  defineEmits  defineExpose/ref

ts写法

defineEmit

defineExpose

2.v-model   组件标签可同时写多个v-model 不再支持  .sync

3.provide inject

4.attrs  会包含父组件的props 属性的集合  一旦用props接收，attrs

就接收不到了

5.插槽

基于vue 3.2

1.defineProps  defineEmits  defineExpose/ref

defineEmits

//father

//son

defineExpose  父组件需要借助ref

ts写法

defineProps 三种写法

 let props= defineProps(['str'])console.log(props);let props = defineProps({str:String,arr:{type:Object,default:()=>[1,2]}})let props = defineProps<{str:string,arr:number[]
}>()withDefaults(defineProps<{  //设置默认值str:string,arr:number[]
}>(),{arr:()=>[666]
})

defineEmit

let emit = defineEmits(['ca'])let emit = defineEmits<{  // 可以对每一个参数进行限制(e:'ca',a:string,b:number,c:string):void
}>()let changeArr = ()=>{emit('ca','999',88,'jjj')
}

defineExpose

defineExpose<{n:string,s:Function}>({n:'999',s:()=>console.log('999'),
})let wf = ref>();
onMounted(()=>{wf.value?.s();console.log(wf.value?.n);
})

2.v-model   组件标签可同时写多个v-model 不再支持  .sync

3.provide inject

4.attrs  会包含父组件的props 属性的集合  一旦用props接收，attrs

就接收不到了

5.插槽

动态插槽  

 import { ref } from 'vue';
let dyniamic = ref('dyniamic')
let dyniamicChange = ()=>{dyniamic.value = 'test'
}

具名插槽也可以 当作用域 用