Tabla de contenido
1. Tres formas de comunicación entre los componentes padre e hijo
2. Enlace de atributo, padre -> hijo
3. Vinculación de eventos, hijo -> padre
Cuarto, obtenga la instancia del componente
1. Tres formas de comunicación entre los componentes padre e hijo
- Enlace de propiedad: se utiliza para configurar datos del componente principal a la propiedad especificada del componente secundario, solo se pueden configurar datos compatibles con JSON
- Enlace de eventos: se utiliza para que los componentes secundarios pasen datos a los componentes principales, se puede pasar cualquier dato
- Obtener la instancia del componente: el componente principal puede obtener el objeto de la instancia del componente secundario a través de this.selectComponent(), de modo que pueda acceder directamente a cualquier dato y método del componente secundario
2. Enlace de atributo, padre -> hijo
Los subcomponentes declaran y usan las propiedades correspondientes en el nodo de propiedades.
3. Vinculación de eventos, hijo -> padre
El enlace de eventos se utiliza para pasar valores del elemento secundario al principal, y se puede pasar cualquier tipo de datos. Los pasos a utilizar son los siguientes:
En el archivo js del componente principal, defina una función que se pasará al componente secundario en forma de evento personalizado
/**
* 组件的方法列表
*/
methods: {
customMethod: function () {
// 这里使用triggerEvent返回名称为myevent的事件，并携带一个参数
this.triggerEvent('myevent',true)
}
}Usar en el componente principal
<view>
<Test5 bind:myevent="handleMyevent"></Test5>
</view>Cuarto, obtenga la instancia del componente
En el componente principal js, manéjelo de la siguiente manera:
getChild() {
const child = this.selectComponent('Test5')
child.setData({count: child.properties.count + 1})
child.countAdd()
}