欢迎来到深圳市星若文化传媒有限公司
星若文化
服务热线:0755-83021329
手机号码:189-2464-0109
  • 网站建设
  • 网络营销
  • 软件开发
  • 技术服务
  • 品牌设计
  • 平台代运营
  • 营销课堂

如何快速学会小程序开发

来源:星若文化
时间:2018-10-09 14:11:26
分享到:

  如何快速学会小程序开发

  “小程序是一个不需要下载安装就是可直接使用的应用,它是实现了应用触手可及的梦想,用户扫一扫或者是搜一下即是可打开应用的。

  也是体现了用完即走的一个理念,用户不用关心是否安装太多应用的问题。应用将无处不在,随时可用,但是又无需安装和卸载 ”

  ——张小龙


如何快速学会小程序开发

  这是张小龙用小程序内测时发在朋友圈的一段话对小程序进行了定义。

  小程序凭借免安装,即开即用,用完就走等优势,加之小程序基于微信坐拥10亿用户,使得许多商户入驻小程序,它将线上与线下结合极大地促进了新零售的消费模式。总之小程序的发展前景是很可观很值得看好。

  目前小程序开发主要有三种方式,原生微信小程序、mpvue和wepy微信小程序开发框架等,下图是三个开发框架的对比,一起和星若文化小编去看看

  微信小程序

  mpvue

  wepy

  语法规范

  小程序

  开发规范

  Vuejs

  开发规范

  类vue

  开发规范

  标签集合

  小程序

  标签

  Html标签+

  小程序标签

  小程序标签

  样式规范

  wxss

  sass,less

  postcss

  sass,less

  slyus

  组件化

  无组件化

  机制

  vue.js

  组件规范

  自定义组件规范

  多端复用

  不可复用

  支持

  替换为h5

  支持

  替换为h5

  自动构建

  本身无

  自动构建

  Webpack

  构建

  框架内置自动构建

  上手成本

  全新学习

  熟悉Vuejs

  即可

  Vuejs和wepy

  集中

  数据管理

  不支持

  使用vuex

  实现

  不支持

  mpvue 是美团点评开源的一个使用Vue.js开发小程序的前端框架。框架基于Vue.js 核心,mpvue 修改了 Vue.js 的runtime 和compiler 实现,使其可以运行在小程序环境中,从而为小程序开发引入了整套 Vue.js 开发体验。开源当天收获六千七百个star。

  mpvue使得同一套代码能同时运行在小程序和web端,能够实现多端复用,如果你已经有vue的开发经验, mpvue开发小程序是一个很不错的选择,无需学习原生的小程序语法就能快速上手。

  下面将介绍如何使用mpvue快速开发一个微信小程序

  开发环境:nodejs + vue-cli + 微信开发者工具

  vue-cli是vue提供的一个官方的脚手架,使用如下命令:vue init mpvue/mpvue-quickstart my-project快速创建一个基于mpvue-quickstart模板项目, 进入my-project执行npm install 和npm run dev后,会生成一个dist目录,其中是小程序相关的代码,最后将my-project目录导入微信开发者工具,一个mpvue项目就启动了。

  其中pages目录下面是小程序的页面,每个页面的目录结构都是类似的包含一个vue单文件组件和一个main.js文件,可以很方便的使用组件化的方式开发小程序。

  Vue的生命周期和小程序的生命周期在mpvue中是兼容的,但是推荐使用vue生命周期,因为小程序的生命周期在其他端如web端是没有相关生命周期的,如小程序onLaunch可以用vue的created代替,但是有些生命周期是小程序独有的如onPullDownRefresh,这时只能使用小程序自带的生命周期函数。


给文章一个赞赏吧
扫一扫,快速掌握相关攻略
关注星若文化微信公众号
关注星若文化微信公众号
关注星若文化微信小程序
关注星若文化微信小程序



叶小姐
营销顾问
18924640109
微信同号