18326051278

O2O解决方案>>

社区物业O2O
连锁电商O2O
上门维修O2O
农村电商O2O
多用户商城

行业平台类

汽车服务平台
家居服务平台
综合电商平台
家政服务平台
多门店商城系统

网站解决方案

全能型企业站
营销型网站
高端定制网站
品牌设计站
HTML5网站

APP解决方案

生鲜APP开发
物流APP开发
家居服务APP
汽车金融APP
多用户商城APP

定制开发类

APP开发
微信开发
小程序开发
网站建设
平台合作
返回列表
微信小程序教程解读,毅耘科技
安徽毅耘科技有限公司,安徽app开发,合肥APP开发,微信小程序教程解读2018-11-13毅耘科技650

微信小程序教程解读

微信小程序教程解读

  在制作微信小程序之前,需要用一个邮箱注册一个小程序账号,填写一些企业或个人信息,如果没有发布的打算,建议最后不需要完成300的微信认证。

  之后,就可以在公众平台使用注册的帐户进行登录。

  然后,在主页面左边列表中点击设置,再设置页面中选开发设置,就可以看到AppID。而AppID 可以用于在开发工具中进行登记,使用开发工具的高级功能。你可以到官网下载开发工具。

  开始项目:

  打开开发者工具,选择小程序选项,然后直接点击「添加项目」按钮。我们可以在这个步骤,填入刚才注册的时候使用的 AppID。

  如果项目目录中的文件是个空文件夹,会提示是否创建 quick start 项目。

  选择「是」,开发者工具会帮助我们在开发目录里生成一个简单的 Demo。

  这个 Demo 拥有一个完整的小程序的大概框架。

  1. 框架

  我们首先看一下官方提供的 Demo 含有的目录:

  app.js:小程序逻辑、生命周期、全局变量。

  app.json:小程序公共设置、导航栏颜色等,不可以注释。

  app.wxss:小程序公共样式,类似 CSS 。

  小程序页面构成类似这样:

  每一个小程序页面是由同路径下同名的四个不同后缀文件的组成,如:index.js、index.wxml、index.wxss、index.json

  微信小程序中的每一个页面的路径和页面文件名,都需要写在app.json的pages中,且pages数组中的第一个页面是小程序的首页。

  这四个文件按照功能可以分成三个部分:

  配置:json 文件

  逻辑层:js 文件

  视图层:wxss.wxml 文件

  在 iOS 上,小程序的逻辑代码运行于 JavaScriptCore 中,而在 Android上,这个任务则是交给 X5 内核来完成。

  在 开发工具上, 小程序的 JavaScript 代码是运行在 NW.js(Chrome 内核) 中。这也导致开发工具上的效果跟实际效果有所出入。

微信小程序教程解读,毅耘小程序

  2. 组件

  微信提供了许多组件,主要分为八种:

  这其中,包含了view、scroll-view、button、form等普通常用的组件,也提供了地图mapcanvas

  组件主要属于视图层,通过 WXML 来进行结构布局,类似于 HTML。样式则通过 WXSS 来定义和修改,它的语法和使用都近似 CSS。

  组件使用语法实例:

  <><>

  3. API

  网络

  媒体

  数据

  位置

  设备

  界面

  开发接口

  网络请求接口包含了普通的 HTTPS 请求,支持上传、下载、Socket,基本上满足了我们开发中所需要的网络需求。

  这些 API 属于逻辑层,写在 JS 逻辑文件中。

  使用实例:

  wx.getLocation({ type: 'wgs84', success: function(res) { var latitude = res.latitude var longitude = res.longitude var speed = res.speed var accuracy = res.accuracy } })

  可以到官方文档 – API 查看其它 API 的使用方法。

  编译运行

  1. 模拟器调试

  我们可以在微信提供的开发者工具中,使用模拟器查看小程序运行的效果。

  之前我们提过,小程序的运行底层不同,这也导致在模拟器上的效果,会与在手机上运行有些差异。

  2. 真机调试

  在左边的选项栏中,选择项目,然后点预览会生产一个二维码,用管理员微信号扫一扫,就可以在真机上看实际效果。

  以上就是微信小程序的全部教程,更多相关资讯,欢迎访问毅耘科技:http://www.webappcloud.cn/




本文标题:微信小程序教程解读

本文网址:http://www.yiyuncloud.com/index/id/2103.html

原创网址:合肥APP开发公司<毅耘科技> 版权所有,转载标明出去,并以链接形式链接网址:www.yiyuncloud.com

文章标签:合肥APP开发 合肥软件开发 合肥o2o社区 合肥商城开发 合肥B2B2C商城开发

毅耘科技(www.yiyuncloud.com)是一家拥有新型网站建设与程序开发经验的公司,致力于解决企业网络服务问题,紧跟着网络变化的步伐,为企业提供网络科技服务。平台服务:品牌网站建设 、网站开发、微信开发、APP开发、软件开发、网校系统开发、多用户商城开发、分销商城开发、微商城、一元云购系统开发、O2O系统开发、商标注册、网络营销等项目。是专业为企业提升价值的公司。

分享到:

相关文章