微信小程序的index.js怎么写？详细代码见下方↓

微信小程序实例index.js代码如下：

可以搜索小程序名称： 快芹羡递最后一公里

实例index.js代码

var app = getApp()

Page({

/**

* 页面的初始数据

*/

data: {

//三张图片轮播

imgUrls: [

{

imageUrl: '/images/weicha/timg1.jpg',

},

{

imageUrl: '/images/枣亩weicha/timg2.jpg',

},

{

imageUrl: '/images/weicha/timg3.jpg',

}

],

indicatorDots: false,

autoplay: false,

interval: 5000,

duration: 800,

},

onSwiperTab: function (e) {

/*var postId = e.target.dataset.postId

wx.navigateTo({

url: postId,

})*/

},

/**

* 生命周期函数--监听页面加载

*/

onLoad: function (options) {

app.loginWinCha(this.initPageData)

},

//初始化登录才能查看的数据

initPageData: function () {

this.setData({

componentList: [

{

id: 1,

url: '../weicha/express/courier/index',

imageUrl: '/images/weicha/timg1_1.jpg',

title: '快递小哥(送快递)',

queryType: 'courier'

},

{

id: 2,

url: '../weicha/express/seller/index',

imageUrl: '/images/weicha/timg1_2.jpg',

title: '合作商家(代收快递)',

queryType: '凳首森seller'

},

{

id: 3,

url: '../weicha/express/personal/index',

imageUrl: '/images/weicha/timg1_3.jpg',

title: '收件人(签收快递)'

},

{

id: 4,

url: '../weicha/express/logistics/index',

imageUrl: '/images/weicha/timg1_4.jpg',

title: '快递物流查询'

}

]

})

},

onItemClick: function (e) {

var targetUrl = e.currentTarget.dataset.pay

var targetQueryType = e.currentTarget.dataset.index

if (targetQueryType == "seller") {

var reqData = {

seller_openId: app.globalData.openid,

status: '2'

}

this.queryDBUtil("sellerInfo", reqData, targetQueryType, targetUrl,

"亲，您暂未申请商家,请提交商家申请！")

} else if (targetQueryType == "courier") {

var reqData = {

courier_openId: app.globalData.openid,

status: '2'

}

this.queryDBUtil("courierInfo", reqData, targetQueryType, targetUrl,

"亲，您暂未申请快递员,请提交快递员申请！")

} else {

wx.navigateTo({

url: targetUrl

})

}

},

queryDBUtil: function (reqCollectionName, reqData,queryType, retUrl,retMgs){

wx.cloud.callFunction({

name: "utilsDB",

data: {

collectionName: reqCollectionName,

collectionWhere: reqData

},

complete: res =>{

let retStatus = '1'

if (res.result.data.length >= 1) {

retStatus = res.result.data[0].status

}

if (retStatus == '2') {

if (queryType == "seller"){

app.globalData.seller = res.result.data[0]

} else if (queryType == "courier"){

app.globalData.courier = res.result.data[0]

}

wx.navigateTo({

url: retUrl

})

} else {

wx.showToast({

icon: 'none',

title: retMgs

})

}

},

fail: err =>{

wx.showToast({

icon: 'none',

title: retMgs

})

}

})

}

})

（1）在目录树上右键，选择新建 Page，将自橘雹并动生成页面所圆迹需要的 wxml、wxss、js、json。（2）在 app.json 的 pages 字段，添加需要新建的页面的路径，将会自动生成该页面所需要的文件。自动保存。希望能肆猛帮助的到您！

1. 小程序的代码目录是wxml，wxss和js。wxml相对于早期的XML，扩展了花括号模板的写法。JS部分，小程序支持ECMAScript6，由于没有Web，自然DOM、Window这些都不能用，jQuery就更没啥关系了。

2. 如果你有html5的代码基础，自学是非常简单的。而JS代码就皮皮需要比较多的书籍才能完成。所以自学代码的时间长度是比较长的，这样你就错过了小程序的红燃银差利期了。

3. 如果你没有代码基础，使用即速应用吧，这是一个可视化拖拽搏兄的微信小程序开发工具。没基础的小程序er也能开发。制作完成以后，可以打包小程序代码，直接上传到微信开发者工具中进行审核的。

4. 如果你想自学，你免不了要看学习资料，你可以看看咫尺论坛的小程序资讯和demo还有学习视频教程，微信开发者文档等。

---