小程序中类似Vue的ref获取组件内部属性和方法

给子组件添加一个id属性,方便查找

<view>

<first-component />

</view>

1

2

3

通过this.selectComponent方法查找子组件

Page({

/**

* 页面的初始数据

*/

data: {

},

/**

* 生命周期函数--监听页面初次渲染完成

*/

onReady: function () {

console.log(this);

// 获取子组件的数据

console.log(this.selectComponent("#mycomp").data);

// 调用子组件的方法

this.selectComponent("#mycomp").huanghaili()

debugger

}

})

1

2

3

4

调用子组件方法 this.selectComponent("#mycomp").huanghaili()

查找子组件的属性 this.selectComponent("#mycomp").data

子组件定义的逻辑

Component({

/**

* 组件的属性列表

*/

properties: {

},

/**

* 组件的初始数据

*/

data: {

msg: 'i am msg'

},

/**

* 组件的方法列表

*/

methods: {

huanghaili: function () {

console.log("huanghaili")

}

}

})