小程序怎么开发自己的小程序

开发制作一个小程序分为6个步骤，注册第三方小程序平台、挑选模板、编辑设计内容、在线配置与打包、下载开发者工具上传程序包、提交审核与发布。

工具：机械革命S3Pro、Windows10、百度浏览器v8.7.9。

1、注册第三方工具

主要是为了快速获取合适的模板，通过搜索引擎进入平台注册账号后，在功能分区选择小程序，进入小程序模板库。

2、挑选小程序模板

小程序模板分为官网和商城2个类别，可根据自己的情况进行选择，模板按照行业进行划分，如在行业分类里没有找到意向的模板，也可以到其它相近行业进行挑选。

3、编辑设计内容

模板里的原有内容样式均可移动、替换和二次设计，包括文字、图片、视频、颜色、背景、特效和链接等，鼠标点击目标模板自动d备大宴出编辑框和配置按钮，如图所示。

4、在线配置与打包

在设计好仿银模板后，点击右上角“发布”按钮，选择对应的发布平台渠道，配置APPID和密钥，进行打包小程序并下载到本地。

5、下载开发者工具

到对应的发布平台下载开发者工具，进行在线安装，登录平台账号密码，上传小程序包。

6、提交审核与发布

有的平台审核程序比较多，建议提交审核的时候，把列表的功能全部选择。在通过审核以后，有的平台不仿御会自动上线，需要手动点击“发布上线”。

在组件上使用 wx:for 控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。即wx:for指令用于循环数组数据，生成组件。

循环出来的每一项通过item返回，每一项对应的索引，通过index返回。

wx:key=""，设置每一项唯一的标识。循环列表时，添加wx:key的好处是，将来列表发生变化时重新渲染列表的损耗为更低。

使用 wx:for-item 可以指定数组当前元素的变量名，使用 wx:for-index 可以指定数组当前下标的变量名：

条件渲染可以使用 wx:if 或 hidden 。

一般来说，wx:if 有更高的切换消耗而 hidden 有更高的初始渲染消耗。因此，如果需要频繁切换的情景下，用 hidden 更好；如果在运行时条件不大可能改变，则 wx:if 较好。

wx:if用于条件渲染：条件为真生成里面的内容，条件为假不会生成里面的内容。扮祥（每次重新生成内容）

也可以用 wx:elif 和 wx:else 来添加一个 else 块。

hidden用于条件渲染：条件为真隐藏里面的内容，条件为假显示里面的内容。（每次切换样式）

在app.json文闹纯件中添加tabBar节点。tabBar是小程序客户端底部或顶部tab栏的实现。

color： tab上的文字默认颜色，仅支持十六进制颜色。

selectedColor： tab上的文字选中时的颜色，仅支持十六进制颜色。

backgroundColor： tab的背景色，仅支持十六进制颜色。

borderStyle： tabbar上边框的颜色， 仅支持 black / white。

position： tabBar的位置，默认值是: bottom，仅支持 bottom / top。当 position 为 top 时，不显示 icon。

custom： 自定义tabBar。

list是一个数组，它定义了tab的列表。只能配置最少2个、最多5个tab。

pagePath： 页面路径，必须在 pages 中先定义。

text： tab 上按钮文字。

iconPath： 图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，不支持网络图片。

selectedIconPath： 选中时的图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，不支持网络图片。

跳转到普通页，可以直接通过返回按钮返回。

navigateTo()方法，用于跳转普通页面。可以直接通过返回按钮返回。

页液缺咐面js文件中添加方法：

redirectTo()方法，关闭当前页面再跳转到指定页，不能通过返回按钮返回页面。该方法不能用于跳转tabBar页面。

页面js文件中添加方法：

跳转到tabBar页面，通过tabBar按钮返回。

如果要使用navigator组件跳转tabBar页面，需要设置open-type="switchTab"。

switchTab()方法，用于跳转tabBar页面。

页面js文件中添加方法：

微信版本升级后，打开微信，点击底部的“发现”这个菜单项，就会发现升级后的“发现”菜单里，增加了“小程序”这样一个功能。

2.点击打开小程序后，可以看到有附近的小程序和我的小程序，附近的小程序是耐巧唯所在定位周边的小程序。

下面的小程序列表可以看到的是我们之前宽模打开过的一些小程序，如果有自己觉得很好用的小程序就可以点击左上角，添加到我的小程昌培序里面。

3.微信小程序还有具有搜索功能，打开搜索页面可以输入想要找的小程序。

---