It has been 703 days since the last update, the content of the article may be outdated.

Vue3数据传递

setup中数据传递相关

组件注册

直接导入即可使用,无需注册

父传子

props

js
1
2
3
4
5
6
defineProps({
msg:{
type:String,
default:'hello'
},
})

子传父

emits派发事件
js
1
2
3
4
5
let em = defineEmits(['send'])
const handler = ()=>{
// 第一个参数为事件名,第二个为传递的数据
em('send','子向父传值')
}
ref子传父
在子组件中先暴露
js
1
2
3
4
let params = '子组件暴露的数据'
defineExpose({
params
})
在父组件中获取
js
1
2
3
4
5
//获得当前实例,this指向
const that = getCurrentInstance()
onMounted(() => {
console.log(that.refs.helloworld.params)
})