微信小程序父子组件方法调用方法汇总

父组件向子组件传值

父组件通过属性传值

<childEle childParams="{{params}}"></childEle>

子组件通过properties接收：

properties: {childParams: { type: String }
}

子组件调用父组件方法

父组件定义方法，childFun是子组件中的方法名，fun是父组件中的方法名。我们通过chidlFun来调用fun。

<childEle childParams="{{params}}" bind:childFun="fun"></childEle>

父组件方法：

childFun(e){console.log('我是父组件的方法', e)
}

当点击子组件的按钮执行 clickFun 时调用父组件的方法

clickFun(){this.triggerEvent('childFun');//如果需要传递参数，直接写在triggerEvent的参数里即可
}

父组件调用子组件的方法

<childEle id="childEle" childParams="{{params}}" bind:childFun="fun"></childEle>

父组件的 onReady 生命周期中获取 childEle 元素

onReady(){this.childEle = this.selectComponent('#childEle');
}

父组件的点击事件 childF 调用子组件的事件：

<view bindtap="childF">我是父组件的点击事件</view>

父组件触发子组件的方法：

childF(){this.childEle.foo()
}

这里的 foo即为子组件的方法。

微信小程序父子组件方法调用方法汇总相关推荐

微信小程序父子组件传值问题
微信小程序父子组件传值问题把自己碰到的问题或者学到的东西在这里总结,慢慢积累在父子组件传值时,我发现子组件竟然拿不到父组件传过来的值. 我指的拿不到父组件的值,是指在子组件的生命周期created ...
微信小程序自定义组件数据、方法和属性
一 data 数据在小程序组件中,用于组件模板渲染的私有数据,需要定义到 data 节点中,示例如下. Component({ /** * 组件的初始数据 */ data: { count: 0 } ...
可以实现微信小程序父子组件实时通信的插件
小程序在组件化开发的时候可能没有达到vue那样的便捷,例如跨组件状态同步等. 这个插件可以: 1.通过代理的方式,为小程序添加了跨组件实时通信:父子组件实时同步状态功能: 2.与vue相似的Watch ...
微信小程序父子组件通信
父子组件之间有3种通信方式 1.属性绑定用于父组件向子组件的指定属性设置数据,只能传递普通类型的数据,无法将方法传递给子组件 2.事件绑定用于子组件向父组件传递数据,可以传递任意数据①在父组件的j ...
微信小程序父子组件相互通信
父组件传值给子组件在父组件中引用子组件 {"component": true,"usingComponents": {"alert-tip" ...
微信小程序父子组件通讯/传值
3种方式: 属性绑定:父组件向 --> 子组件的指定属性设置数据.仅能设置json兼容的数据,如:基本数据类型.object等 (不能传递复杂属性的数据,如:方法等). 事件绑定:子组件向 ...
微信小程序自定义组件的使用方法
1.定义组件在根目录下新建components来放置不同功能的组件例:新建头部功能组件NavHeaders文件夹,然后在这个文件夹上右键新建component 新建完的组件文件如下: 其中.wxm ...
微信小程序父子组件通信详解
1 父组件向子组件传递数据: 1.1 在父组件的文件夹中的.json文件下引入子组件 {"usingComponents": {//"Tab" 是自己定义的组件 ...
微信小程序setinterval_微信小程序中setInterval的使用方法
微信小程序中setinterval的使用方法看了下小程序的画布功能,简单的使用了一下,用蹩脚的逻辑做了个 "弹啊弹,弹走鱼尾纹的小球",一起来看下吧.过程不重要主要是画布的使用哦 ...

微信小程序父子组件方法调用方法汇总

父组件向子组件传值

子组件调用父组件方法

父组件调用子组件的方法

微信小程序父子组件方法调用方法汇总相关推荐

最新文章

热门文章