微信小程序——页面中调用组件方法
我现在有一个弹层的组件(popup),组件里面定义了显示组件(showPopup)和隐藏组件(hidePopup)的方法。
我们如何在调用组件的页面中调用组件里面的方法呢?
在调用组件的页面写如下代码:
onReady: function() {
this.popup = this.selectComponent("#popup"); //组件的id
},
showPopup(){
this.popup.showPopup(); //组件里里面定义的showPopup方法
},
hidePopup() {
this.popup.hidePopup(); //组件里里面定义的hidePopup方法
},
对上面的代码做个简易说明:
先看下效果图:

对应代码截图:
1.调用页面(Page/.../index.wxml)

2.组件页面(compoents/popup/index.js):

推荐2篇写的不错的博文,可以看看:
【微信小程序】自定义组件
小程序自定义组件的具体实现+页面与自定义组件间的通信
微信小程序——页面中调用组件方法的更多相关文章
- 微信小程序页面调用自定义组件内的事件
微信小程序页面调用自定义组件内的事件 page page.json { "usingComponents": { "my-component": ". ...
- 微信小程序页面跳转方法总结
微信小程序页面跳转目前有以下方法(不全面的欢迎补充): 1. 利用小程序提供的 API 跳转: // 保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面.// 注 ...
- 微信小程序--页面与组件之间如何进行信息传递和函数调用
微信小程序--页面与组件之间如何进行信息传递和函数调用 这篇文章我会以我自己开发经验从如下几个角度来讲解相关的内容 页面如何向组件传数据 组件如何向页面传数据 页面如何调用组件内的函数 组件如何调 ...
- 微信小程序开发过程中tabbar页面显示的相关问题及解决办法!
在微信小程序的开发过程中如果有使用过tabbar的同学,我相信一定会遇到一些困扰.为什么有些时候代码中明明已经在app.json里面增加了tabbar,可以页面中就是不显示呢?可不可以有些页面显示ta ...
- 总结微信小程序开发中遇到的坑
总结微信小程序开发中遇到的坑,一些坑你得一个一个的跳啊,/(ㄒoㄒ)/~~ 1,页面跳转和参数传递实例 首先说一下我遇到的需求有一个我的消息页面,里面的数据都是后端返回的,返回的数据大致如下,有一个是 ...
- 在微信小程序页面间传递数据总结
在微信小程序页面间传递数据 原文链接:https://www.jianshu.com/p/dae1bac5fc75 在开发微信小程序过程之中,遇到这么一些需要在微信小程序页面之间进行数据的传递的情况, ...
- 微信小程序-页面跳转与参数传递
QQ讨论群:785071190 微信小程序页面跳转方式有很多种,可以像HTML中a标签一样添加标签进行跳转,也可以通过js中方法进行跳转. navigator标签跳转 <view class=& ...
- [转] 微信小程序页面间通信的5种方式
微信小程序页面间通的5种方式 PageModel(页面模型)对小程序而言是很重要的一个概念,从app.json中也可以看到,小程序就是由一个个页面组成的. 如上图,这是一个常见结构的小程序:首页是一个 ...
- 全栈开发工程师微信小程序-上(中)
全栈开发工程师微信小程序-上(中) width: 750rpx; 750rpx代表与屏幕等宽,rpx的缩写responsive pixel,这个单位是可以根据屏幕大小进行自适应调整的像素单位. 小程序 ...
随机推荐
- 如果使用EntityFramework6链接Mysql
web.config文件中加入这些: <entityFramework codeConfigurationType="MySql.Data.Entity.MySqlEFConfigur ...
- 使用vlc实现视频TS流的推送
鉴于Mpeg TS流播放的需求,使用 VLC作为Server来实现输出Mpeg TS 本文仅涉及如何使用VLC的Command来实现作为视频流Server通常可以使用下述四种方式来推送Mpeg ...
- grafana 邮件报警
https://my.oschina.net/go4it/blog/830714 grafana 教程 http://download.csdn.net/detail/shuijinglei198 ...
- 高精度运算库gmp
网址:www.gmplib.org 我下载的是 6.1.2版本:https://gmplib.org/download/gmp/gmp-6.1.2.tar.bz2 执行操作如下: 1. tar -jv ...
- GDC2017资料整理
GDC2017的资料最近放出来了,我筛选了一下 特别是Horizon放出很多干货,也有一些去年的末班车.Vulkan有一堆,但不是很感兴趣 感谢王同学的搬运和分类(包含以下链接pdf和视频): htt ...
- Atitit 路径规划法attilax总结 扫描线路法
Atitit 路径规划法attilax总结 扫描线路法 2017/2/8 20:43:37[吐槽]深圳-小 2017/2/8 20:43:37 群主做什么的2017/2/10 10:03:15系统消 ...
- Atitit nodejs5 nodejs6 nodejs 7.2.1 新特性attialx总结
Atitit nodejs5 nodejs6 nodejs 7.2.1 新特性attialx总结 1.1. Node.js 4.0.0 已经发布了 .这是和 io.js 合并之后的首个稳定版本,它 ...
- [svc]jdk+tomcat部署.jforum论坛部署
安装jdk和tomcat jdk1.7.0_13(系列)下载url 我这里用的最新的jdk. 去官网下载即可 cd /usr/local/src/ tar xf jdk-8u162-linux-x64 ...
- Golang IO包的妙用
Golang 标准库对 IO 的抽象非常精巧,各个组件可以随意组合,可以作为接口设计的典范.这篇文章结合一个实际的例子来和大家分享一下. 背景 以一个RPC的协议包来说,每个包有如下结构 type P ...
- 每日英语:How the College Bubble Will Pop
The American political class has long held that higher education is vital to individual and national ...