微信小程序页面调用自定义组件内的事件详解


Posted in Javascript onSeptember 12, 2019

这篇文章主要介绍了微信小程序页面调用自定义组件内的事件详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

page

page.json

{
  "usingComponents": {
    "my-component": "../components/component/component",
  }
}

page.wxml

<my-component id="myComponent"></my-component>

page.js

Page({
 //...
 onLoad: function () {
  let myComponent = this.selectComponent('#myComponent'); // 页面获取自定义组件实例
  myComponent.componentInnerFunction(); // 通过实例调用组件事件
 }
 //...
})

component

component.js

Component({
  //...
  methods: {
    componentInnerFunction: function() {
      console.log('i am inner function');
    }
  }
  //...
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript cookies 设置、读取、删除实例代码
Apr 12 Javascript
jquery 事件对象属性小结
Apr 27 Javascript
收集json解析的四种方法分享
Jan 17 Javascript
escape编码与unescape解码汉字出现乱码的解决方法
Jul 02 Javascript
常用的JS验证和函数汇总
Dec 23 Javascript
Web纯前端“旭日图”实现元素周期表
Mar 10 Javascript
JS字符串统计操作示例【遍历,截取,输出,计算】
Mar 27 Javascript
jq源码解析之绑在$,jQuery上面的方法(实例讲解)
Oct 13 jQuery
jQuery.validate.js表单验证插件的使用代码详解
Oct 22 jQuery
细述Javascript的加法运算符的具体使用
Oct 18 Javascript
node.js中事件触发器events的使用方法实例分析
Nov 23 Javascript
jQuery实现简易QQ聊天框
Feb 10 jQuery
基于JavaScript 实现拖放功能
Sep 12 #Javascript
Node.JS用纯JavaScript生成图片或滑块式验证码功能
Sep 12 #Javascript
layui 对table中的数据进行转义的实例
Sep 12 #Javascript
layui点击数据表格添加或删除一行的例子
Sep 12 #Javascript
小程序如何支持使用 async/await详解
Sep 12 #Javascript
layui清空,重置表单数据的实例
Sep 12 #Javascript
layui table 多行删除(id获取)的方法
Sep 12 #Javascript
You might like
这东西价格,可以买几台TECSUN S-2000
2021/03/02 无线电
PHP编码规范-php coding standard
2007/03/16 PHP
PHP Global定义全局变量使用说明
2013/08/15 PHP
yii操作session实例简介
2014/07/31 PHP
CentOS 安装 PHP5.5+Redis+XDebug+Nginx+MySQL全纪录
2015/03/25 PHP
浅谈Yii乐观锁的使用及原理
2017/07/25 PHP
Laravel如何使用Redis共享Session
2018/02/23 PHP
laravel框架中控制器的创建和使用方法分析
2019/11/23 PHP
如何简单地用YUI做JavaScript动画
2007/03/10 Javascript
图像替换新技术 状态域方法
2010/01/28 Javascript
jquery选择器的选择使用及性能介绍
2013/01/16 Javascript
node.js操作mongoDB数据库示例分享
2014/11/26 Javascript
13个PHP函数超实用
2015/10/21 Javascript
js实现select二级联动下拉菜单
2020/04/17 Javascript
详解node-ccap模块生成captcha验证码
2017/07/01 Javascript
JavaScript中使用参数个数实现重载功能
2017/09/01 Javascript
JavaScript实现短暂提示框功能
2018/04/04 Javascript
让你5分钟掌握9个JavaScript小技巧
2018/06/09 Javascript
vue 巧用过渡效果(小结)
2018/09/22 Javascript
微信小程序实现日历签到
2020/09/21 Javascript
JS中队列和双端队列实现及应用详解
2020/09/29 Javascript
python使用xlrd模块读写Excel文件的方法
2015/05/06 Python
python抓取搜狗微信公众号文章
2019/04/01 Python
Python实现的登录验证系统完整案例【基于搭建的MVC框架】
2019/04/12 Python
python基于Selenium的web自动化框架
2019/07/14 Python
python 画条形图(柱状图)实例
2020/04/24 Python
html5-websocket基于远程方法调用的数据交互实现
2012/12/04 HTML / CSS
html5自动播放mov格式视频的实例代码
2020/01/14 HTML / CSS
Net-A-Porter美国官网:全球时尚奢侈品名站
2017/02/11 全球购物
The North Face北面美国官网:美国著名户外品牌
2018/09/15 全球购物
物理研修随笔感言
2014/02/14 职场文书
校园环保建议书
2014/05/14 职场文书
大专生自荐书范文
2014/06/22 职场文书
大客户经理岗位职责
2015/04/09 职场文书
导游词之西递宏村
2019/12/10 职场文书
生命的关键成分来自太空?陨石说是的
2022/04/29 数码科技