小程序公用js提取到app.js中调用的实例

时间:2022-02-07 08:10:26

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");
}
})