1, 08_05小程序的自定义组件的引用,传值
首先是组件的引用
1,在父组件中的json文件中引入
例如:
{
"usingComponents": {
"Paying":"/components/paying/paying"
}
}
2,在父组件中直接使用
<view>
<button class="btn_pay">支付</button>
<Paying/>
</view>
这样子组件就可以正常使用
注:在父组件json中引入组件引入时路径不会自动补全,需手动添加最后的"Paying"
接着是父传子的方法:
1,在父组件中组件的标签加上需要传的属性,属性名自己定义即可,属性值就是传过去的值
2,在子组件中的js文件中定义
/**
* 组件的属性列表
*/
properties: {
title:{
type:String,//传过来的属性类型
value:"弹出层标题1"//没传参的默认值
},
content:{
type:String,
value:"弹出层内容1"
}
},
3,在组件间中{{属性名}}即可拿到传递的参数
父组获取子组件的方法和参数
1,先给父组件中的组件标签加上一个ID
2,在父组件的js文件中onReady()(页面初次渲染执行)中写入var comname= selectComponent("#ID")通过刚才定义的ID获取组件的信息,然后在父组件中的按钮上增加点击事件,在子组件中的js文件中写上自己需要执行的方法,通过点击父组件的按钮,调用父组件的方法,在父组件的方法中调用this.comname.子组件中的方法名()来调用子组件中的方法
子传父用的是triggerEvent
1,在子组件中的点击事件中执行this.triggerEvent("方法名","参数")
2,在父组件中的子组件的标签上加上一个属性bind方法名=“在父组件中的js方法”
3,在父组件中的js文件中执行“在父组件中的js方法(e){console.log(e)}”这里可以看到detail就是自己的从子组件传过来的值