微信小程序页面开发注意事项整理


Posted in Javascript onMay 18, 2017

小程序的开发注意事项:

1、js文件

每个页面对应的js文件可以定义页面onReady,onLoad,onShow,onHide,onUnload,还有页面的数据,自定义的函数要写到一块,内部约定是都写到默认函数的后面。既“页面中先data,再默认函数,再自定义函数”方便review code,提高协作效率。

2、json文件

默认不能为空,即使没有内容也要为空数据{},原先定义在app.json中的内容,如果需要在当前页面中重新定义,那么只要把内容复制过来,直接赋新值即可,用于设置小程序的状态栏、导航条、标题、窗口背景色。常用的是页面的标题

{
 "navigationBarTitleText": "我的",
 "selfdata":"全栈工程师师不靠谱更新",
 "tabBar": {
  "list": [{
  "pagePath": "pagePath",
  "text": "text",
  "iconPath": "iconPath",
  "selectedIconPath": "selectedIconPath"
  }],
  "position":"top"
 }
}

见惯了菜单在底部的,来一个在top吧。

3、wxml文件

页面头部和底部需要封装好,做成模版,分别导入入页面

<import src="/pages/common/head.wxml"/>
<import src="/pages/common/foot.wxml"/>

之前HTML编写的好习惯还是要带入进来有head还有foot,当然业务内容就body,每一块就用一个view包装起来,方便控制布局和class

页面加载的时候获取数据,从网络或从缓存中,数据再通过页面的data中定义的内容在页面渲染。具体的呈现列表、条件这些多多的使用。

4、wxss文件

@import "common.wxss";

公共样式、reset样式要根据不同项目提前管理好,不要使用px,不要使用px,不要使用px,重要的事情要说三遍,小程序为了保证兼容和自适应使用了新的单位rpx

5、要提供一个供用户清理本地缓存的按钮。相当于项目的reset开关,缓存数据、文件数据、授权数据这些可能要不同项目中用到。

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
jquery EasyUI的formatter格式化函数代码
Jan 12 Javascript
一个可以增加和删除行的table并可编辑表格中内容
Jun 16 Javascript
Javascript基础知识(二)事件
Sep 29 Javascript
js限制input标签中只能输入中文
Jun 26 Javascript
JavaScript对数组进行随机重排的方法
Jul 22 Javascript
AngularJS页面访问时出现页面闪烁问题的解决
Mar 06 Javascript
jQuery代码实现图片墙自动+手动淡入淡出切换效果
May 09 Javascript
js鼠标跟随运动效果
Mar 11 Javascript
Vue CLI3中使用compass normalize的方法
May 30 Javascript
关于angular浏览器兼容性问题的解决方案
Jul 26 Javascript
JS检测浏览器开发者工具是否打开的方法详解
Oct 02 Javascript
cypress测试本地web应用
Jun 01 Javascript
基于BootStrap的前端分页带省略号和上下页效果
May 18 #Javascript
微信小程序网络请求wx.request详解及实例
May 18 #Javascript
微信小程序实现锚点定位楼层跳跃的实例
May 18 #Javascript
Vue2 使用 Echarts 创建图表实例代码
May 18 #Javascript
AngularJS折叠菜单实现方法示例
May 18 #Javascript
jQuery Validate 校验多个相同name的方法
May 18 #jQuery
easyUI下拉列表点击事件使用方法
May 18 #Javascript
You might like
关于PHP语言构造器介绍
2013/07/08 PHP
php项目中百度 UEditor 简单安装调试和调用
2015/07/15 PHP
PHP面向对象程序设计之命名空间与自动加载类详解
2016/12/02 PHP
javascript iframe中打开文件,并检测iframe存在否
2008/12/28 Javascript
解决jquery .ajax 在IE下卡死问题的解决方法
2009/10/26 Javascript
9个JavaScript评级/投票插件
2010/01/18 Javascript
Jquery 常用方法经典总结
2010/01/28 Javascript
一些相见恨晚的 JavaScript 技巧
2010/04/25 Javascript
jQuery插件Skippr实现焦点图幻灯片特效
2015/04/12 Javascript
jQuery Mobile框架中的表单组件基础使用教程
2016/05/17 Javascript
BootStrap 可编辑表Table格
2016/11/24 Javascript
原生JS实现《别踩白块》游戏(兼容IE)
2017/02/20 Javascript
JS操作input标签属性checkbox全选的实现代码
2017/03/02 Javascript
Angularjs为ng-click事件传递参数
2017/06/15 Javascript
前端主流框架vue学习笔记第二篇
2017/07/26 Javascript
js+css实现红包雨效果
2018/07/12 Javascript
微信小程序项目实践之验证码倒计时功能
2018/07/18 Javascript
全网小程序接口请求封装实例代码
2020/11/06 Javascript
js加减乘除精确运算方法实例代码
2021/01/17 Javascript
[01:06:43]完美世界DOTA2联赛PWL S3 PXG vs GXR 第二场 12.19
2020/12/24 DOTA
python的常见命令注入威胁
2013/02/18 Python
python类继承用法实例分析
2014/10/10 Python
在Python的Django框架中显示对象子集的方法
2015/07/21 Python
python自动化工具之pywinauto实例详解
2019/08/26 Python
英国蜡烛、蜡烛配件和家居香氛购买网站:Yankee Candle
2018/12/12 全球购物
美国NBA官方商店:NBA Store
2019/04/12 全球购物
定义一结构体数组表示分数,并求两个分数相加之和
2013/06/11 面试题
花店创业计划书范文
2014/02/07 职场文书
毕业生就业意向书
2014/04/01 职场文书
电子商务助理求职自荐信
2014/04/10 职场文书
社区科普工作方案
2014/06/03 职场文书
乡镇八一建军节活动方案
2014/08/24 职场文书
2014年乡镇团委工作总结
2014/12/18 职场文书
高中生打架检讨书1000字
2015/02/17 职场文书
2015年九一八事变纪念活动实施方案
2015/05/06 职场文书
企业版Windows 11有哪些新功能? Win11适用于企业的功能介绍
2021/11/21 数码科技