【微信小程序】小程序入门项目简介(请结合上一篇文章一起观看)

1.如何导入已有项目

如下图所示,首先打开微信开发者工具
【微信小程序】小程序入门项目简介(请结合上一篇文章一起观看)_第1张图片
点击导入按钮,选择刚才已解压出来的miniprogram-demo文件夹路径
【微信小程序】小程序入门项目简介(请结合上一篇文章一起观看)_第2张图片

点击新建按钮,即可以正常导入并打开该项目

2.miniprogram-demo项目简介

该demo项目下基于初始化模板项目,新增了四个界面(login、userInfo、list、listDetail),
小程序首页当前为page/login/index页面,

拿首页页面开发举例
该页面显示效果如下
【微信小程序】小程序入门项目简介(请结合上一篇文章一起观看)_第3张图片
页面主要有两个输入框,及一个登录按钮组成,页面标签部分的代码如下
【微信小程序】小程序入门项目简介(请结合上一篇文章一起观看)_第4张图片
对应的输入事件处理及提交事件逻辑代码如下图
【微信小程序】小程序入门项目简介(请结合上一篇文章一起观看)_第5张图片

基本语法部分及可使用的微信原生调用API可以先过一遍的官方语法文档介绍,地址如下
模板部分:
https://developers.weixin.qq....
API部分:
https://developers.weixin.qq....

页面的标题部分配置信息如下
【微信小程序】小程序入门项目简介(请结合上一篇文章一起观看)_第6张图片

附上源码下载地址:
某云
如有不懂的地方可以留言交流,技术是无止境的,还望多多学习。

你可能感兴趣的:(微信小程序)