目录:
- 本机环境
- 自定义组件(子组件)
- 页面中引入(父组件引入子组件)
- 父组件(使用自定义组件的页面)传值给子组件
- 子组件(自定义组件)传值给父组件
- 备注
一、本机环境
本机系统: Mac
小程序开发者工具: 1.5.7
二、自定义组件(子组件)
子组件中:
项目的根目录下!!创建自定义组件
在对应json
文件中定义component
属性
如图在根目录 的 `components` 目录(目录名自定义)下存放自定义组件
三、页面中引入(父组件引入子组件)
父组件中:
路径引入在对应页面下
添加json
文件中定义usingComponents
axml
文件中直接使用
如图
(图 3.1)
(图 3.2)
四、父组件(使用自定义组件的页面)传值给子组件
子组件中:
通过属性props
传递值numIndex
在data
中定义对应的值itemIndex
在生命周期didMount
中修改对应的值
如图 子组件
(图 4.1)
4.2、⚠️⚠️然后子组件可以调用传递进来的方法,将参数传给父组件对应的方法,父组件的该方法获取参数修改自己组件内的值
如上图:
props: {
onQuantityValue: function(d) {
console.log('d-----', d)
}
...
...
}
...
// 直接如下方式调用父组件传递的函数即可
this.props.onQuantityValue('子组件想要传递给父组件的值,在此处赋值即可')
五、子组件(自定义组件)传值给父组件
子组件通过函数参数,传递值给父组件
子组件通过props
属性传递函数,但是注意⚠️,函数名必须以on
开头
父组件中给对应函数属性,传递对应的方法
如图 父组件
(图 5.1)
如图 父组件
(图 5.2)
备注
第 五 步尴尬了很久,因为函数名不是以 on
开头的!!!,过分,开发文档的提示,可不可以加个其他颜色呐!!!微笑😊,参考这里:
写给自己的随笔,有问题欢迎指出