17666030540

网站建设 APP开发 小程序

KNOWLEDGE/知识

分享你我感悟

您当前位置>主页 > 知识 > 小程序 >

微信小程序开发实践入门教程

发表时间:2020-05-11 18:36

文章来源:快明科技

浏览次数:

点击蓝字 关注我们


2017年微信小程序正式发布上线

来源丨网络(侵删)


在去年2017年1月9日,张小龙在2017微信公开课Pro上发布的小程序正式上线 。时至今日,小程序已经有两年多了。


什么是小程序?

微信小程序是一种全新的连接用户与服务的方式,它可以在微信内被便捷地获取和传播,同时具有出色的使用体验 。


不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或者搜一下即可打开应用 。


如何开发小程序?

搭建小程序


安装环境,是很简单的,下载完安装包直接安装即可。

我们的开发环境如下:

创建小程序


不用注册,直接运行小程序即可

小程序项目结构


从上面项目结构图,可以看到一个页面构成主要有三大部分构成 index.wxml 、index.wxss 、index.js 。一看,怎么跟前端的这么类似 。


认真一看,这功能还真是没差别 。对于会一点前端知识的,我想,要入门小程序开发,应该是很简单的 。


一个网页主要 HTML CSS JS 这样的组合,其中 HTML 是用来描述当前这个页面的结构,CSS 用来描述页面的样子,JS 是用来处理这个页面和用户的交互。小程序的页面跟这个完全相同 ,不一样的就是改了个名字 。


除了以上页面的三大构成,还有项目的根目录还有一个 app.json 和 project.config.json 。


app.json 是对当前小程序的全局配置,包括了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等。


project.config.json 可以针对各自喜好做一些个性化配置,例如界面颜色、编译配置等 。

配置项目的底部导航


介绍完小程序的具体目录,接下来,带大家看看如何配置项目的底部导航 。

小程序要实现这个底部导航其实很简单,我们只要在根目录下的app.json文件中配置:

具体官方文档:

https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html

创建新页面


小程序的页面创建,都是需要在配置文件中配置一下路径,不然无法访问 。配置也非常简单,只需要在app.json文件下找到一个pages的属性值 。


pages属性:接受一个数组,每一项都是字符串,来指定小程序由哪些页面组成。每一项代表对应页面的【路径 文件名】信息,数组的第一项代表小程序的初始页面。小程序中新增/减少页面,都需要对 pages 数组进行修改。


 注意:文件名不需要写文件后缀 ,而且路径不能写错!

YesPMP

一站式项目实施交付服务平台

每周分享互联网IT资讯和干货技巧

喜欢本篇内容请给我们点个在看


本文由快明科技整理发布,如需转载请联系852657156@qq.com

相关案例查看更多