微信小程序开发文档官方版发布

  微信公众平台团队喜欢在深夜给人惊喜,这不,微信小程序开发文档昨晚23点半发出了,很多开发者表示要兴奋得睡不着了。和ytkah一起看看小程序文档吧!小程序文档包含:小程序简易教程、小程序框架、小程序组件、小程序API、小程序工具、Q&A

  您不会错过这些内容:微信小程序设计指南官方版放出

本文档将带你一步步创建完成一个微信小程序,并可以在手机上体验该小程序的实际效果。这个小程序的首页将会显示欢迎语以及当前用户的微信头像,点击头像,可以在新开的页面中查看当前小程序的启动日志。下载源码
1. 获取微信小程序的 AppID

如果你是收邀请的开发者,我们会提供一个帐号,利用提供的帐号,登录 https://mp.weixin.qq.com ,就可以在网站的“设置”-“开发者设置”中,查看到微信小程序的 AppID 了,注意不可直接使用服务号或订阅号的 AppID 。

如果是游客模式,可以跳过本步骤

注意:如果我们不是用注册时绑定的管理员微信号,在手机上体验该小程序。那么我们还需要操作“绑定开发者”。即在“用户身份”-“开发者”模块,绑定上需要体验该小程序的微信号。本教程默认注册帐号、体验都是使用管理员微信号。

2. 创建项目

​ 我们需要通过开发者工具,来完成小程序创建和代码编辑。

​ 开发者工具安装完成后,打开并使用微信扫码登录。选择创建“项目”,填入上文获取到的 AppID ,设置一个本地项目的名称(非小程序名称),比如“我的第一个项目”,并选择一个本地的文件夹作为代码存储的目录,点击“新建项目”就可以了。

​ 为方便初学者了解微信小程序的基本代码结构,在创建过程中,如果选择的本地文件夹是个空文件夹,开发者工具会提示,是否需要创建一个 quick start 项目。选择“是”,开发者工具会帮助我们在开发目录里生成一个简单的 demo。

 

项目创建成功后,我们就可以点击该项目,进入并看到完整的开发者工具界面,点击左侧导航,在“编辑”里可以查看和编辑我们的代码,在“调试”里可以测试代码并模拟小程序在微信客户端效果,在“项目”里可以发送到手机里预览实际效果。
3. 编写代码
创建小程序实例

​ 点击开发者工具左侧导航的“编辑”,我们可以看到这个项目,已经初始化并包含了一些简单的代码文件。最关键也是必不可少的,是 app.js、app.json、app.wxss 这三个。其中,.js后缀的是脚本文件,.json后缀的文件是配置文件,.wxss后缀的是样式表文件。微信小程序会读取这些文件,并生成小程序实例

​ 下面我们简单了解这三个文件的功能,方便修改以及从头开发自己的微信小程序。

​ app.js是小程序的脚本代码。我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。调用框架提供的丰富的 API,如本例的同步存储及同步读取本地数据。想了解更多可用 API,可参考 API 文档

//app.js
App({
  onLaunch: function () {
    //调用API从本地缓存中获取数据
    var logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs)
  },
  getUserInfo:function(cb){
    var that = this;
    if(this.globalData.userInfo){
      typeof cb == "function" && cb(this.globalData.userInfo)
    }else{
      //调用登录接口
      wx.login({
        success: function () {
          wx.getUserInfo({
            success: function (res) {
              that.globalData.userInfo = res.userInfo;
              typeof cb == "function" && cb(that.globalData.userInfo)
            }
          })
        }
      });
    }
  },
  globalData:{
    userInfo:null
  }
})

 app.json 是对整个小程序的全局配置。我们可以在这个文件中配置小程序是由哪些页面组成,配置小程序的窗口

时间: 2024-11-10 05:34:14

微信小程序开发文档官方版发布的相关文章

微信小程序开发之scroll-view

本文主要介绍通过scroll-view实现回至顶部,如下效果 一.页面代码 顶部的工具栏放一个查找按钮,滚动区域实现分页,目的就是为了点击上一页\下一页时,自动回到顶部. scroll-view必须指定scroll-y属性和该区域的高度 <view class="page"> <view class="swiper-tab border-top"> <view> <text class='text-primary'>查

微信小程序开发之picker

一.绑定简单数组 通过bindChange控制index,使得当前选择值发生改变 示例1 data: { Data: ['A','B'], Index: 0, }, <picker class="picker" bindchange="bindChange" value="{{Index}}" range="{{Data}}"> <view > 当前选择:{{Data[Index]}} </vie

微信公众平台开发文档 网页授权获取用户基本信息

网页授权获取用户基本信息   如果用户在微信中(Web微信除外)访问公众号的第三方网页,公众号开发者可以通过此接口获取当前用户基本信息(包括昵称.性别.城市.国家).利用用户信息,可以实现体验优化.用户来源统计.帐号绑定.用户身份鉴权等功能.请注意,"获取用户基本信息接口是在用户和公众号产生消息交互时,才能根据用户OpenID获取用户基本信息,而网页授权的方式获取用户基本信息,则无需消息交互,只是用户进入到公众号的网页,就可弹出请求用户授权的界面,用户授权后,就可获得其基本信息(此过程甚至不需要

微信公众平台开发文档 生成带参数的二维码

为了满足用户渠道推广分析的需要,公众平台提供了生成带参数二维码的接口.使用该接口可以获得多个带不同场景值的二维码,用户扫描后,公众号可以接收到事件推送. 目前有2种类型的二维码,分别是临时二维码和永久二维码,前者有过期时间,最大为1800秒,但能够生成较多数量,后者无过期时间,数量较少(目前参数只支持1--100000).两种二维码分别适用于帐号绑定.用户来源统计等场景. 用户扫描带场景值二维码时,可能推送以下两种事件: 如果用户还未关注公众号,则用户可以关注公众号,关注后微信会将带场景值关注事

微信公众平台开发文档 用户分组管理

开发者可以使用接口,对公众平台的分组进行查询.创建.修改操作,也可以使用接口在需要时移动用户到某个分组. 目录 [隐藏] 1 创建分组 2 查询所有分组 3 查询用户所在分组 4 修改分组名 5 移动用户分组 创建分组 一个公众账号,最多支持创建500个分组. 接口调用请求说明 http请求方式: POST(请使用https协议) https://api.weixin.qq.com/cgi-bin/groups/create?access_token=ACCESS_TOKEN POST数据格式:

微信公众平台开发文档 上传下载多媒体文件

公众号在使用接口时,对多媒体文件.多媒体消息的获取和调用等操作,是通过media_id来进行的.通过本接口,公众号可以上传或下载多媒体文件.但请注意,每个多媒体文件(media_id)会在上传.用户发送到微信服务器3天后自动删除,以节省服务器资源. 上传多媒体文件 公众号可调用本接口来上传图片.语音.视频等文件到微信服务器,上传后服务器会返回对应的media_id,公众号此后可根据该media_id来获取多媒体.请注意,media_id是可复用的,调用该接口需http协议. 接口调用请求说明 h

微信公众平台开发文档 客服接口

当用户主动发消息给公众号的时候(包括发送信息.点击自定义菜单click事件.订阅事件.扫描二维码事件.支付成功事件.用户维权),微信将会把消息数据推送给开发者,开发者在一段时间内(目前修改为48小时)可以调用客服消息接口,通过POST一个JSON数据包来发送消息给普通用户,在48小时内不限制发送次数.此接口主要用于客服等有人工消息处理环节的功能,方便开发者为用户提供更加优质的服务. 接口调用请求说明 http请求方式: POST https://api.weixin.qq.com/cgi-bin

微信公众平台开发文档 获取用户基本信息

在关注者与公众号产生消息交互后,公众号可获得关注者的OpenID(加密后的微信号,每个用户对每个公众号的OpenID是唯一的.对于不同公众号,同一用户的openid不同).公众号可通过本接口来根据OpenID获取用户基本信息,包括昵称.头像.性别.所在城市.语言和关注时间. 获取用户基本信息 开发者可通过OpenID来获取用户基本信息.请使用https协议. 接口调用请求说明 http请求方式: GET https://api.weixin.qq.com/cgi-bin/user/info?ac

微信公众平台开发文档 语音识别

开通语音识别功能,用户每次发送语音给公众号时,微信会在推送的语音消息XML数据包中,增加一个Recongnition字段. 注:由于客户端缓存,开发者开启或者关闭语音识别功能,对新关注者立刻生效,对已关注用户需要24小时生效.开发者可以重新关注此帐号进行测试. 开启语音识别后的语音XML数据包如下: <xml> <ToUserName><![CDATA[toUser]]></ToUserName> <FromUserName><![CDAT