vue3 父给子传参

80 阅读1分钟
父组件中
<Son :title="name" :ar="arr"></Son>
子组件中
const props =  defineProps<{
    title: string,
    ar: number[]
  }>()  
  要用props接收下,才能取值
  
  定义默认值
  withDefaults(defineProps<{
    title: string,
		ar: number[]
  }>(), {
		ar: () => [66]
	}) 
        
        子组件给父组件传值
        子组件中 import {defineProps, defineEmits} from 'vue'

const emit = defineEmits(['on-click'])
const send = () => {
	emit('on-click', 'as', 333)
}
父组件中
<Son :title="name" :ar="arr" @on-click="getName"></Son>
 const getName = (name, age) => {
    console.log('name', name)
    console.log('age', age)
  }
  用ts的方式
  const emit = defineEmits<{
	(e: 'on-click', name:string):void
}>()
const send = () => {
	emit('on-click', 'as', 333)
}