初试小程序
  1. 微信小程序开发

    1. 录播
      微信小程序开发
      45分钟

对课程感兴趣?

点击报名,听课时长可兑换余额哦~

初试小程序免费

最近在学 6 累计报名 2 好评度 -
咨询老师

课程概述

目录

评论

老师介绍

  • 黑马先锋陈老师

    黑马先锋陈老师

    资深前端开发专家,精通Html5、Css3及移动开发,对前端主流框架vue,react等有深入的了解,具备全栈的能力,项目经验丰富。曾在去哪网等大型互联网公司负责移动端及混合开发。先后开发过全球购及其后台管理系统等多个大型项目。
简  介 小程序作为连接线上线下的平台,一边是9.8亿的微信月活跃用户,一边是10000万的线下商户,至少有千亿级、甚至是万亿级的市场规模。
直接进入微信平台下载即可
小程序每个界面一般来说对应有三个文件
xxx.js 用于逻辑控制,相当于ViewController,包含界面的数据源,生命周期和操作函数
所有的数据源和函数操作都被声明在
Page({
})
需要注意的是,所有的成员函数调用时必须加上this,否则无法识别。
xxx.wxml 用于界面展示,相当于View,用于界面展示
xxx.wxss 用于界面显示的样式,相当于css
几个使用到生命周期函数
onLoad--界面第一次加载时
onReachBottom--用于加载更多,表示界面到底
wx.request({
    method: 'POST',
    header:{
      //模拟器默认是content-type
      //真机默认是Content-Type
      'content-type': 'application/x-www-form-urlencoded'
    },
    url: 'https:xxxx
    data: {
      'action': 'get_list',
      'pages': this.currentIndex,
      'pagesize':10,
    },
    success:function(res) {
    },
    fail: function (res) {
    }
  })
}
Post请求必须设置content-type,否则服务器无法正常的获取到参数。获取到数据后,
需要调用this.setData更改数据源,这样小程序就会自动刷新当前页面
通过scroll-view包裹view 模拟实现IOS中的UITableView,scroll-view中的view对应每一行的cell。
指定wx:for会自动遍历数据源中的数组,在view中的item就是数组中的元素,这些都是系统提供的命名,直接写即可。
用于使用到了打开外部链接功能,小程序貌似目前暂时不提供打开浏览器功能,因此需要自定义一个page用于展示外部链接
首先,定义一个新的page,我在这里是直接手动新建所需的那三个文件,然后在view中只放入web-view标签。
注意:新定义的page必须在app.json的pages声明,否则无法正常调用
跳转代码
wx.navigateTo({
    url: '../outHtml/outHtml?outUrl=' + event.target.dataset.img,
  })
获取页面参数的代码
onLoad: function (options) {
console.log(options.outUrl)

* 课程提供者:黑马先锋学院

老师还为你推荐了以下几门课程