免费个人网站空间:微信小程序的先容和筹备
本文摘要: 什么是小程序微信之父张小龙是这样描述的:小程序是一种不需要下载安装就可以使用的应用,它实现了应用触手可及的梦想。用户扫一扫或者搜一下即可打开应用,也体现了用完即走的理念。用户不用关心是否安装太多应用的问题:应用将无处不在,随时可用,但又无

什么是小程序
微信之父张小龙是这样描述的:
小程序是一种不需要下载装置就能够使用的应用,它完成了应用触手可及的梦想。

用户扫一扫或者搜一下即可打开应用,也体现了用完即走的理念。
用户不用关怀是否装置太多应用的问题:
应用将无处不在,随时可用,但又无需装置卸载。

应用:

1.适用多种营销场景:网上开店、数码家电、门店引流、营销活动、在线预定、外卖配送等。

2.适用多行业:食物快消、数码家电、母婴亲子、美妆护肤、教育培训、日用百货、生果生鲜、餐饮外卖、蛋糕烘焙、美容美发、休闲文娱、酒店旅游等。

利益:

1.开发问度低,难度不及App,可以满足简略的基础应用,合适日子效劳类线下店肆及非刚需低频应用的转换。

2.同步订单,跟微商城或零售店肆打通,无需额定运营本钱,轻松管理。

3.自带流量,微信9亿月活跃用户,邻近的小程序、微信查找等功用,让你轻松获取流量,抓住客户。

4.可以尝试优惠券/码、满减/送、多人拼团等多种营销玩法,抓住流量,获取销量。

5.可以调用比H5更多的手机体系功用进行开发,例如GPS定位、录音、拍视频、重力感应等,能开发更丰厚的使用场景。

6.打开速度比普通H5快,挨近原生App。

7.在安卓手机上可以添加到手机桌面,看上去跟原生App差不多,但仅限安卓手机,iphone就不行了。

8.运转速度跟App差不多,也能做出很多H5做不到的功用,开发本钱跟H5差不多,相对来说开发本钱比App要低。

缺点:

1.只有1M的巨细,导致无法开发大型的小程序,所以现在很多小程序很小、很简略。

2.小程序的技能框架还不安稳,开发方法时常有修正,导致短时间内常常要晋级维护。

3.不能跳转外链网站地址,直接影响了小程序的开放性。

4.不能直接分享到朋友圈。

5.需要像App一样审核上架,比H5即做即发布要麻烦。

准备工作
1.注册账号 ()
2.激活Email
3.信息挂号
4.登录小程序管理后台(不完善好信息是无法发布小程序的)
5.完善小程序信息,绑定开发者(尤其是团队多人开发)

在官网下载装置开发东西

装置完成后就能够登录:

微信扫码登录开发者东西,这里选小程序项目,进入小程序本地项目进行管理


新建一个项目:

目录自选本地文件夹,AppID就是登录微信开发平台后的设置里能看到的AppID。
假如没有ID也能够使用官方的测试号,但这样只能做做简略的本地测试,终究是填上合适的项目名称。




上手第一个小程序新建项目

选择一个空目录,使用普通快速启动模板
然后就能够看到预设的模板和内容了,可以直接查看或者点击编译在手机上扫一扫查看

接下来了解一下小程序的目录结构:


pages
index
index.js 页面脚本逻辑文件
index.wxml 页面模板文件
index.wxss 页面样式文件
index.json 单个页面的配相信息,比如头部底色,头部title等

utils
app.js 全局逻辑
app.json 全局配相信息,包括了小程序的所有页面途径,界面体现,底部tab等根本信息
app.wxss 设置样式
project.config.json 开发东西的配相信息

小程序的启动过程:


打开小程序之前,微信会把小程序的代码包下到本地。
然后通过app.json的pages字段知道其时小程序的所有页面途径,写在pages字段的第一个页面就是小程序的官网。

然后微信就把官网代码装载进来,烘托出官网。

然后app.js里App的实例onLaunch回调就会执行来一段简略的实战,为项目添加一个city选择页:
首要添加一个新的页面

1.在pages文件添加新页面文件

2.为city.wxml模板页面添加选择器:


picker是一个类似于select的picker组件
bindchange是用于绑定一个change工作的方法
value的值是一个序列号
range则是表明这个选择器的取值规模

3.然后在city.js中书写页面逻辑:


Page({})是页面的一个实例
data中的数据用于视图绑定
bindPickerChange则是绑定的change工作的函数名

可以看到,data中的数据可以在页面中被直接绑定使用
在js代码中想要改变data的值也十分简略,使用this.setData就能够了
这里我们传入了一个index序列号,也就是picker选择器选择了country数组中的元素。

通过这样的方法,就能够为页面添加不同的组件。

4.选择之后假如想要将选中的city的值传到其他页面比如官网

那么一般来讲有3种方法:

第一种是将数据存到全局的data中,也就是app.js的data中,这样所有的页面都能取到这些数据。
但我们其实不引荐这样的用法,就好像我们不引荐使用全局变量都一样。

第二种是将数据带在url途径后作为参数传导:

这样的做法在传输杂乱数据的时分其实不是太适宜。

第三种则是使用本地存储,在需要的页面再将其取出就能够了:
// 存储
wx.setStorageSync( city , {});
// 取出
wx.getStorageSync( city

这样就完成了我们的第一个上手小页面的开发。小程序的开发有时分其实不简略,需要等更多的学习时间来完成。北京是你的选择。

? ? 请注明出处,谢谢。
您需要我们为您提供网站建设效劳吗?

我们将在24小时之内与您取得联络
或致电 咨询