一条龙小程序开发教程

初次上手

微信小程序已经成为国内前端的一个重要业务，跟 Web 和手机 App 有着同等的重要性。小程序开发者供不应求，市场招聘需求极其旺盛，企业都抢着要。

尽管如此，小程序的教程却很缺，要么是不够系统，要么就是跳跃性太大，很多关键的地方寥寥数语，初学者摸不着头脑。我自己学的时候，就苦于找不到好一点的教程。

本文就是我的小程序学习笔记，整理成教程的形式，希望对于初学者有用。需要学会的主要知识点，我都会讲到，我的目标是你读完这个教程，就能学会怎么写小程序。

小程序是什么

微信小程序是运行在微信里面的程序，本质上还是网页，跟HTML一样，只是换成了WXHL，也还是会用到javascript，css，跟前端三件套基本差不多，但是小程序不能再浏览器环境运行，只能用微信小程序的API，因为底层应该被微信重新封装了一层，但是本质还是javascript，所以如果你会前端，会javascript，开发小程序并不难。

开发准备

申请小程序

开发小程序之前，可以先去注册一个小程序，这个非常简单，去微信公众号申请注册就行，

需要一个没有注册过微信号的邮箱，随便找一个邮箱注册，再去邮箱里面验证一下就注册成功了，

注册成功会生成一个APPID这个非常重要，后面会用到，会伴随整个小程序使用

申请完了之后我们可以填一个小程序的基本信息，包括小程序名称，简介，头像这些基本信息，还有微信认证，备案这些，我们放在下面专门说

开发工具

小程序申请完了，我们还需要小程序开发工具，上面我们说了小程序都是微信自己的api，所以也有自己的开发工具和开发环境，可以直接去管网下载就行微信开发者工具下载地址，

下载安装工具成功后，会让你扫码登录，这里你直接扫码登录就好，这里登录的账号最好是上面小程序配置的管理员或者开发者的账号，到时候开发好了，方便上传代码，提交审核等流程

正式开发

上面开发工具下载安装、登录好之后，我们就可以直接开始开发小程序了，首先小程序开发，要看你自己是否需要服务器后端，也就是数据来源，调用的接口，服务器后端是用自己的服务器还是用小程序自己的云开发，这里跟大家简单介绍下云开发，云开发就是比如你只是会前端开发，不会后端开发，那么你就可以选择用云开发，当然云开发也是需要钱的，毕竟服务器资源肯定是需要钱，但是云开发是按照调用次数来收费的，并不是按月，如果你得小程序访问量不大，这样算下来肯定还是比买服务器划算得多，如果你确实不会后端开发，那么，可以选择使用云开发，如果你的小程序是工具类这种，或者信息记录，这些不需要后端的话，那么你可以直接开发了。

我们打开开发工具可以选择小程序自己提供得小程序模板，这些模板都是有源代码得，可以先熟悉熟悉小程序得语法，之类得，要是懂前端，懂vue，那么小程序开发基本可以无缝切换

语法简介

我这简单跟大家罗列一下基本的语法，大家基本上就明白了

首先小程序得结构都是需要这几个文件，js处理逻辑代码。json配置一些页面或者自定义组件得基本配置信息，wxml就是页面模板元素，wxss就是页面样式文件，非常清晰，大家看下模板的代码，一看基本就明白了，基本每个文件夹都是这种结构，只是分为页面还是组件的配置是不一样的，js代码略有不同，页面使用page包裹，组件使用component包裹

下面说下语法，语法我就跟vue进行对比，都非常容易理解，大家看着自己的模板再看文章自行理解调试，这样学习起来更加容易上手

下面介绍一些常见得语法，和逻辑处理


循环
// vue
v-for="(item, index) in list" :item="item" :key="index"

// wx
wx:for="{{list}}" wx:for-item="item" wx:for-index="index" wx:key="index"
——————————————————————————————————————————————————————————————————————————

if判断
// vue
v-if="visible"

// wx
wx:if="visible"
——————————————————————————————————————————————————————————————————————————

数据定义
// vue
data(){
    return {
        list:[]
    }
}

// wx
data: {
    list:[]
}
——————————————————————————————————————————————————————————————————————————

获取数据
//vue
this.list

//wx
this.data.list
——————————————————————————————————————————————————————————————————————————

修改数据
//vue
this.list = [1,2,3]

//wx
this.setData({ list: [1,2,3] })
——————————————————————————————————————————————————————————————————————————

点击事件
//vue
 @click="copyText"

//wx
 bindtap="copyText"
——————————————————————————————————————————————————————————————————————————

参数传递给子组件
//vue
:visible="visible"

//wx
visible="{{visible}}"
——————————————————————————————————————————————————————————————————————————


子组件接收参数
//vue
props:{
    visible: {
      type: Boolean,
      default: false,
    }
}

//wx
 properties: {
    visible: {
      type: Boolean,
      value: false,
    }
}
——————————————————————————————————————————————————————————————————————————

暴露事件给父组件
//vue
this.$emit('close', false)

//wx
this.triggerEvent('close', false)
——————————————————————————————————————————————————————————————————————————

父组件接收
//vue
@close="handleClose"

//wx
bind:close="handleClose"
——————————————————————————————————————————————————————————————————————————

怎么样是不是一学就会（一做就废），其他的都是很常规的js代码处理，都是通用的js语法，这里就不在陈述了，也可以看看微信官网API文档基础 | 微信开放文档

再开发的时候开发工具还有一些基本操作，可以编译，预览，真机调试这些，大家看下就懂

小程序开发完了之后我们就可以上传代码，右上角有版本管理和上传，版本管理就跟git一样，正常的提交代码就好了，跟git操作一样，上传的话就是你整个小程序都开发完了，需要上线了，就可以上传了，

上传之后就会来到版本管理，先是开发环境，后面是提交审核，审核通过了就可以直接上线了，就可以在微信小程序直接搜索到了。

关于审核小程序

开发其实就是常规操作，大家最烦的应该是关于小程序审核，备案这块，这边也给大家说下我的个人心得

基本信息

小程序的基本信息，就是小程序名称，简介，经营类目，经营内容，管理员基本信息等，大家正常填写就行，审核也是主要核对信息，还有小程序的名称这块经常会很卡，比如你是个人小程序，不需要取太高端大气的，含有公司性质或者听起来是公司性质的，取名的时候大家要前往注意这点，不然肯定会被驳回的，小程序名字只能改两次，千万不要存在侥幸心理，个人最好就带上个人标签之类的名字，比如：张三资料库，李四工具箱，王五服务站等，含有个人标签的，如果是企业的也必须要取跟企业名称或者企业经营挂钩的名称，不能取得别的八竿子打不着得东西，这点千万要注意，提交审核会有工作人员跟你打电话核实，他会考你问你小程序名字，身份证号之类的问题，你正常回答就行，而且不通过也会打电话告诉你怎么改，还有就是经营类目这块，个人一定要选个人得东西，企业得不能选，个人选的类目很优先，而且后面代码审核都是会审核是否符合个人类目得，如果你选了个人类目，不做个人类目的话，代码审核也是不会过关的，所以一定要想好做什么，也可以看下有什么类目，这块还是非常严格的，大家可以看看官方文档个人类目开放范围 | 微信开放文档，

微信认证

一般都会进行微信认证，都会认证不然不能做微信支付，和不能分享之类的，当然个人是不能接入微信支付功能的，这个认证也是交钱，个人是30，企业是300，正常缴费就行，也会有人跟你打电话核实，你确认完基本就审核通过了

备案

这个也是小程序容易被驳回的地方，反正正常初审通过了，初审是小程序工作人员审核，不通过会打电话告知的，怎么改也会告知你，基本没什么问题，就等管局审核，资料齐全了基本没什么问题，只是时间快慢问题，管局审核需要注意这期间管理员的手机会接受到短信，一定要尽快的进行验证，短信是24小时有效期，24小时不通过就需要重新审核，一定注意手机短信。这个管局审核时间，每个省份应该不一样，具体要看，有的快，有点慢

小程序发布

小程序代码内容一定要和类目基本保持一致，不然很容易被驳回，我看网上有说为了过审核，写个变量，线上一套，审核一条代码的，不得不说网友是真的6，但是基本不违规，符合类目都会过审核的，过审之后就可以直接发布上线了，就可以再微信直接搜索到了，这块就是个人卡的比较严格了，很多东西都不能发布，这块就大家看下具体是什么驳回原因，然后改正就行。

好了，我本人也是折腾了一段时间，开发了一个小程序，也欢迎大家观摩指导