注册一个小程序账号,免费下载IDE。
官网查询https://mp.weixin.qq.com/,免费下载IDE。注意:
(1)注册账号后会出现一个appid,新建项目时必须填写,否则很多功能都无法使用,比如浏览、提交代码等。
(2)如果已经申请注册了微信公众平台,一定要关注。微信公众平台和微信小程序是两个账号,appids也不一样。微信小程序的appid必须应用在小程序的定制开发中。
小程序框架详细介绍和管理机制1.每个人都创建了“通用快速入门模板”,然后下面列出了所有新的项目文件:
app.js
所有新项目的启动文档,比如注释写的onlaunch方法,有三个作用:浏览器缓存数据存储和检索的信息;使用回调函数成功登录;获取客户信息。
Global是定义所有新项目的静态变量或变量定义。
app.json
所有新项目的环境变量,如注册网页、装备标签页、设置所有新项目的样式、网页标题等。
!注意:微信小程序默认设置的第一个网页是app.json的pages中的第一个网页
4 .页数
微信小程序的网页部分,几个网页会有几个子文件夹名。比如快速打开模板,会出现两个网页,索引和日志。
5.打开索引文件目录
我们可以看到有三个文档,实际上对应的是大家在web上开发的文档。
Index.wxml匹配Index.wxml
Index.wxss匹配index.css;
Index.js是js文件。
一般人们会继续给每个网页小工具添加一个. json文档,可以作为网页小工具的环境变量,设置网页标题。
6.双击鼠标index.js文件
①var app = getApp();
介绍所有新建项目的app.js文件,用来获取公共自变量等信息内容。
如果你想应用util.js的特殊工具库文件的某种方式,你可以在util.js中导出module.exports,然后你就可以在需要的网页中得到它。
(2)比如我们想获得豆瓣影评,就必须启用api豆瓣电影的;我们先来定义app.js中gloabData中的doubanBase
然后在index.js中应用app.globaData.doubanBase就可以得到这个值
很自然,这种变量定义了当网页需要时,你也可以改变死值。但是,为了所有新项目的维护,建议将此类常用的主要参数统一写入环境变量中。
(3)接下来,在所有页面({})中,第一个数据,也就是这个网页的页面部分的内部数据信息,会被3D渲染成这个网页的wxml文档,类似于vue和react~
根据setData更改的数据信息,3D渲染驱动程序网页。
(4)一些生命周期函数。
比如onload()、onready()、onshow()、onhide(),它们监控页面加载、网页第一次3D渲染、网页显示信息、网页隐藏。
大量可以查官网的API。其中,onload()方法和onShareAppMessage()方法(设置网页共享的信息内容)应用最为广泛。
7.WXML模板的应用。
比如这个新项目电影的网页,就是以最低星级和评论组件wxml为模板,应用Star to Movie to movie-list,层层嵌套循环。
在star-template.wxml的网页上写名字特征;如果后期引入进口,可以根据名称获取。
8.通用wxml徽标
视图、文本、图标、滚动条、块、滚动视图,这种标志可以立即在官网文本文件中查看。
小程序框架、每个网页页面及其公布发布的留意点1。整个架构的一些注意事项
(1)所有wxml网页,最下面的标志是
(2)每个网页顶部导航栏的色调。该网页的json中配有标题。如果没有装备,取app.json中的总装备
(3)不能用3)json写注释,否则会出错。
(4)路由器相关
1)如果wx。SwitchTab用于自动跳转到Tab页面,除了在app.json中申请注册pages网页外,还必须在tabBar中申请注册tab页面才能生效。
注意:标签的最大数量是五个,这意味着头部顶部或底部的标签的最大数量是五个。其他网页只能按照其他路由器方式打开。
2)navigateTo是跳转到非tab页面,如热烈欢迎页面、电影宝贝详情、大城市选择页面;在app.json中申请注册后,不能在tabBar中申请注册,否则不能自动跳转。
3)重新启动自动跳转。新打开的网页左上方没有退款按钮。这个新项目只用过一次,换大城市的条件下。
(5)网页间传输的主要参数
参数主要写在自动跳转的url中,然后在onload模式下通过参数选项接收另一个网页。发送和获取下面的id
(6)数据-自定义特征的应用开始。
比如你怎么用wxml写?
点的恶性事件目标可以这样取,varpostid = event . current target . dataset . postid;
注意:英文大写字母会转换成小写字母,_标记会转换成持力模式。
(7)恶性事件目标event、event.target和event.currentTarget的区别:
Target指的是今天点击的组件,currentTarget指的是恶性事件捕获的组件。
例如,在图片轮播组件中,click事件应该链接到swiper,以便监视任何图片是否被单击。
此时,这里的目标指的是图像(因为被点击的照片),而currentTarget指的是雨刷(因为关联的点击事件在雨刷上)。
(8)应用完全免费的网络电缆端口:
在这个新项目中,采用了日本风天气api、腾讯地图api、百度地图导航api、豆瓣影评api、新闻头条api。实际使用方法可以在官网的界面文档中找到,非常详细。
注意:免费接口有接入权,如果用别人的零件来使用这种插座,不如自己申请新的钥匙更换。
附上另一套完整的完全自由港
:
https://github.com/jokermonn/-Api
!!另外还要注意的是,这个socket的网站域名要分配给微信小程序合理合法的网站域名,否则无法浏览。
(8)wxss有个坑:如果不能加载本地资源,比如本地使用背景图案,就会出错。
把本地照片做成网络图片的几种方法:上传到个人网页;QQ空之间的相册图片这些也是可以的
转换大城市网页页面(1)首页应用navigateTo自动跳转到转换大城市的页面,因为首页没有关闭,导致大城市转换,天气信息还是旧的。
合适的解决方案逻辑如下:
(2)翻转并返回到大城市目录的顶部
根据scroll-view widget的scroll-top特性,原来是0,翻转会提升;单击返回顶部,并将其设置为0以返回顶部。
气温页(1)重新设置网页,显示温度信息的逻辑。
先启用微信小程序的wx.getLocation方法获取当前地理坐标,再启用腾讯地图获取当前城市名称和县城名称,两者共存于公共自变量中。
然后启用查询天气和空燃气指数的方式。
(2)容错机制的解决
大城市名称长短不一,有的很长,比如巴彦淖尔,需要动态获取详细的城市名称。
一些偏远的大城市暂时没有天气信息,一定要区分返回的结果。如果没有信息内容,一定要给客户一个优秀的信息提示。
附近-地图服务网页页面(1)启用百度地图导航的各项服务,搜索酒店餐饮、特色美食、生活服务三种信息内容。其他信息可以在百度地图导航的文本文档中找到。
(2)点击时,给选中的logo加一个外框,数据驱动主视图。所以要用一个长度为3的数字能量数组来存储今天这三个logos是否被选中。
然后wxml根据数据信息动态添加类来改进框架风格。
豆瓣影评页(1)浏览影片的宝贝细节照片,使用微信小程序本身的previewImage。
(2)宝贝详情应用OnReachPhone()方法,可以监督客户向上拖动到恶性事件的底层,然后再推求获取数据信息,从而完成懒加载的实际效果。
(3)为了提高客户体验水平,js将积分金额分值,比如7分,改为7.0分,然后wxml模板判别分值是否为0,并显示“还没有分值”的消息。
(4)检索后清除输入框。
因为不能用getelementbyId的方法来获取微信小程序中的原语,所以要用数据信息来操作。
向数据添加一个特性searchText来存储输入框的内容,并将其与输入的值特性相关联。在搜索进行中或点击X时,清除文本框的实际效果可以通过清除searchText的自变量来实现。
新闻报道网页页面(1)采集新闻标题的免费界面,只返回新闻报道的基本信息,没有新闻报道的主题内容。
我找了很多新闻报道的出口,好像都没有新闻报道的主题内容。如果有人知道更强的插座热烈欢迎留言板,请告诉我~
(2)自然也可以自己爬取新闻媒体的数据信息。
大量网页页面(1)微信小程序现阶段对外开放。外链功能只对公司组织的微信小程序开放。我仍然不能在我的开发和设计中应用外部链接。
(2)小彩蛋网页获取客户信息。
根据wx.setstoragesync('用户信息',用户信息);可以登录微信小程序的客户的隐私信息可以发送到后台管理,存储在数据库查询中,方便分析客户。
我这里只存储在浏览器缓存中,大一点的应该是10M的缓存文件;如果客户将这个微信小程序从小程序流量目录中删除,缓存文件将被清空。
公布留意(1)小程序最新版本仅限2M,一般所有照片都占据最多的室内空房间,尽量使用在线图片。
如何实际把本地照片变成网上的图片,上面提到了。
(2)在微信开发工具上浏览检查一切正常,点击提交;电脑版页面微信小程序个人管理中心左侧的“开发管理”列表,第三块——开发设计版本号有内容。
(3)点击提交,填写微信小程序基本信息,即可提交审核。
注意:最好准确填写分类,以便快速审批。我的微信小程序一天半就审核发布了。
到目前为止,我也经历了两天开发设计中遇到的坑和注意事项。听说也有大量坑,进一步开发设计后再科学研究。