Paso de valor entre componentes primarios y secundarios en vue3

1. Pasar valor entre padre e hijo

El código es el siguiente (ejemplo):

//父组件中的值
import {
    
    ref,provide} form 'vue'

const Arrb = ref(100)
const changeArrb = (n) => {
    
    
	console.log(Arrb)
	Arrb.value = n
			}
const mapRef=ref()
//提供出去值或者方法
provide('mapRef',mapRef)
provide('changeArrb', changeArrb)


//子组件中
import {
    
    inject,watch} form 'vue'
//接受
const mapRef=inject('mapRef')
const changeArrb = inject('changeArrb')
//监听接收到的值
watch(mapRef,(value,old)=>{
    
    
console.log(value)
})
//使用接受的函数,可实现子传父或者在孙子中接受调用,实现孙子传祖
const fn = () => {
    
    
   changeArrb(200000) // 子传父,使用changeArrb方法 修改Arrb的值
 }

Resumir

Proporcionar/inyectar no solo puede realizar de padre a hijo, sino también de padre a nieto, es decir, transferencia de valor de componentes cruzados.
Para hijo a padre o nieto a antepasado, solo necesita usar una función intermedia para cambiar el valor en el padre o antepasado.

Supongo que te gusta

Origin blog.csdn.net/qq_37967853/article/details/128041228
Recomendado
Clasificación