index.wxml:

<view class="datas" bindtap="test01" data-id="">
<text>{{page}}</text>
</view> <view class="datas" bindtap="test02" data-id="">
<text>测试2</text>
</view> <navigator class="test2" url="/pages/page2/page2">跳转到测试页面page2</navigator>

index.wxss:

.datas{
width: 200px;
height: 100px;
background-color: #188eee;
text-align: center;
line-height: 100px;
color: #fff;
margin-top: 20px;
}
.test2{
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;
color: #fff;
background-color: red;
margin-top: 50px;
}

index.js

var app=getApp();
Page({
data: {
page:"测试数据1"
},
/*调用公共方法test01*/
test01:function(event){
var that=this;
app.test01(event,that);
},
/*调用公共方法test02*/
test02: function () {
app.test02();
}
})

page2.wxml:

<view class="page2" bindtap="test01" data-id="page2">
{{page}}
</view>

page2.wxss

.page2{
width: 200px;
height: 100px;
background-color: #188eee;
text-align: center;
line-height: 100px;
color: #fff;
margin-top: 20px;
}

page2.js

var app=getApp();
Page({
data: {
page: "测试数据1"
},
/*调用公共方法test01*/
test01: function (event) {
var that = this;
app.test01(event, that);
},
})

app.json

{
"pages":[
"pages/index/index",
"pages/page2/page2"
],
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "WeChat",
"navigationBarTextStyle":"black"
}
}

app.js

App({

  test01: function (event, that){
that.data.page= "修改后的page数据";
that.setData({
page: that.data.page
});
console.log(event.currentTarget.dataset.id);
}, test02:function(){
console.log("test2");
}
})

小程序公用js提取到app.js中调用的实例的更多相关文章

  1. 小程序基础知识点讲解-WXML + WXSS + JS,生命周期

    小程序基础 小程序官方地址,小程序开发者工具,点击此处下载.在微信小程序中有一个配置文件project.config.json,此文件可以让开发者在不同设备中进行开发. 微信小程序共支持5种文件,wx ...

  2. 微信小程序实质是什么? Hybrid App

    微信小程序是一种不需要下载安装即可使用的应用,用户扫一扫或者搜一下即可打开应用.微信小程序实质是Hybrid技术的应用.Hybrid App(混合模式移动应用). 小程序能够更多的可以更多的调用手机本 ...

  3. 小程序框架之逻辑层App Service

    小程序开发框架的逻辑层使用 JavaScript 引擎为小程序提供开发者 JavaScript 代码的运行环境以及微信小程序的特有功能. 逻辑层将数据进行处理后发送给视图层,同时接受视图层的事件反馈. ...

  4. 转载:微信小程序源码提取反编译

    转载来源:www.51xuediannao.com/xiaochengxu/019c08cc.html 一.前言 微信小程序源码提取反编译,听起来很屌,其实还是简单的,基本是傻瓜式操作.要想拿到微信小 ...

  5. 微信小程序swiper实现 句子控app首页滑动卡片

    微信小程序swiper实现 句子控app首页滑动卡片 引言:最近看到句子控APP首页的效果很清新,可是发现他的微信小程序端没有实现这个功能,我看了一下难度不大,于是尝试着去实现. 实现效果如下: 1. ...

  6. 浅析微信支付:微信支付简单介绍(小程序、公众号、App、H5)

    本文是[浅析微信支付]系列文章的第二篇,主要讲解一下普通商户接入的支付方式以及其中的不同之处. 上篇文章讲了本系列的大纲,没有看过的朋友们可以看一下. 浅析微信支付:前篇大纲 微信支付是集成在微信客户 ...

  7. 林兴爆料小程序很快可以支持各个 App 直接打开小程序

    在微信开放平台基础高级产品经理林兴演讲的当场,他爆料了微信小程序一个轰动性新能力:小程序很快可以支持各个 App 直接打开小程序!没错,你没有听错,简单来说,在不久以后,所有的 App 里面都可以看到 ...

  8. [转]微信小程序之加载更多(分页加载)实例 —— 微信小程序实战系列(2)

    本文转自;http://blog.csdn.net/michael_ouyang/article/details/56846185 loadmore 加载更多(分页加载) 当用户打开一个页面时,假设后 ...

  9. 微信小程序 不在以下合法域名列表中,请参考文档:https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-request.html

    微信小程序  不在以下合法域名列表中,请参考文档:https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-request.html 友情提示: 大家 ...

随机推荐

  1. 20145206邹京儒 Exp8 Web基础

    20145206邹京儒 Exp8 Web基础 一.实践过程记录 Apache (一)环境配置 1.查看端口占用:在这里apach2占用端口80 2.测试apache是否正常工作:在kali的火狐浏览器 ...

  2. 面向对象第一话,大战java正则表达式

    本周我们迎来第一项任务,java面向对象之实现对一串字符的匹配以及构造出计算的多项式,最终得出计算的结果.简而言之,可以用以下的要求来看题目: 输入的多项式字符串中不得出现非法字符 多项式的输入型式, ...

  3. sql逻辑查询语句的执行顺序

    SELECT语句关键字的定义顺序 SELECT DISTINCT <select_list> FROM <left_table> <join_type> JOIN ...

  4. linux网络编程--网络编程的基本函数介绍与使用【转】

    本文转载自:http://blog.csdn.net/yusiguyuan/article/details/17538499 我们深谙信息交流的价值,那网络中进程之间如何通信,如我们每天打开浏览器浏览 ...

  5. python学习笔记比较全

    注:本笔记基于python2.6而编辑,尽量的偏向3.x的语法 Python的特色 1.简单 2.易学 3.免费.开源 4.高层语言: 封装内存管理等 5.可移植性: 程序如果避免使用依赖于系统的特性 ...

  6. Zookeeper一致性协议原理Zab

    ZooKeeper为高可用的一致性协调框架,自然的ZooKeeper也有着一致性算法的实现,ZooKeeper使用的是ZAB协议作为数据一致性的算法, ZAB(ZooKeeper Atomic Bro ...

  7. 翻译header

    !/usr/bin/env pyhton --coding:utf-8-- import urllib.request import urllib.parse import os,sys import ...

  8. Unity3d 生命周期

    生命周期的开始 1.awake   → 脚本被载入时调用的 ↓ 2.OnEnable  → 当对象变为可用或激活状态时 ↓ 3.Start → 第一次Update之前调用 ↓ 4.FixedUpdat ...

  9. 【转载】非Lumia 950/XL机型 强行开启continuum教程

    听说Windows 10 Mobile 的 Continuum 特性很长时间了,但是由于我自己的 Lumia 930 不在支持之列,一直没能体验到这个功能.今天在酷七看到了这篇文章,按文章所述的步骤进 ...

  10. Croc Champ 2013 - Round 1 E. Copying Data 分块

    E. Copying Data time limit per test 2 seconds memory limit per test 256 megabytes input standard inp ...