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


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 相关文章推荐
input 输入框内的输入事件详细分析
Mar 17 Javascript
jQuery中live方法的重复绑定说明
Oct 21 Javascript
javascript学习笔记(二十) 获得和设置元素的特性(属性)
Jun 20 Javascript
如何从jQuery的ajax请求中删除X-Requested-With
Dec 11 Javascript
Javascript闭包用法实例分析
Jan 23 Javascript
js+CSS实现模拟华丽的select控件下拉菜单效果
Sep 01 Javascript
JavaScript jQuery 中定义数组与操作及jquery数组操作
Dec 18 Javascript
js实现小窗口拖拽效果
Dec 03 Javascript
浅谈ECMAScript6新特性之let、const
Aug 02 Javascript
详解axios 全攻略之基本介绍与使用(GET 与 POST)
Sep 15 Javascript
微信小程序自定义带价格显示日历效果
Dec 29 Javascript
node创建Vue项目步骤详解
Mar 06 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和ACCESS写聊天室(二)
2006/10/09 PHP
优化PHP程序的方法小结
2012/02/23 PHP
基于PHP导出Excel的小经验 完美解决乱码问题
2013/06/10 PHP
PHP中preg_match正则匹配中的/u、/i、/s含义
2015/04/17 PHP
php判断对象是派生自哪个类的方法
2015/06/20 PHP
thinkphp 抓取网站的内容并且保存到本地的实例详解
2017/08/25 PHP
PHP实现redis限制单ip、单用户的访问次数功能示例
2018/06/16 PHP
PHP函数用法详解【初始化、嵌套、内置函数等】
2020/06/02 PHP
Js 随机数产生6位数字
2010/05/13 Javascript
JavaScript中使用正则匹配多条,且获取每条中的分组数据
2010/11/30 Javascript
Javascript 自适应高度的Tab选项卡
2011/04/05 Javascript
jQuery动态地获取系统时间实现代码
2013/05/24 Javascript
jQuery实现高亮显示的方法
2015/03/10 Javascript
简单解析JavaScript中的__proto__属性
2016/05/10 Javascript
JS结合bootstrap实现基本的增删改查功能
2016/07/22 Javascript
javascript 闭包详解及简单实例应用
2016/12/31 Javascript
js获取元素的偏移量offset简单方法(必看)
2017/07/05 Javascript
vue监听scroll的坑的解决方法
2017/09/07 Javascript
浅谈从React渲染流程分析Diff算法
2018/09/08 Javascript
详解如何使用nvm管理Node.js多版本
2019/05/06 Javascript
webpack安装配置与常见使用过程详解(结合vue)
2020/06/01 Javascript
python中sets模块的用法实例
2014/09/30 Python
Python获取Windows或Linux主机名称通用函数分享
2014/11/22 Python
python2和python3在处理字符串上的区别详解
2019/05/29 Python
解决python中用matplotlib画多幅图时出现图形部分重叠的问题
2019/07/07 Python
matplotlib绘制正余弦曲线图的实现
2021/02/22 Python
德国机车企业:FC-Moto
2017/10/27 全球购物
数字漫画:comiXology
2020/06/13 全球购物
绩效专员岗位职责
2013/12/02 职场文书
2014年世界艾滋病日演讲稿
2014/11/28 职场文书
技术员岗位职责
2015/02/04 职场文书
医务人员医德考评自我评价
2015/03/03 职场文书
个人年终总结结尾
2015/03/06 职场文书
2016学习依法治国心得体会
2016/01/15 职场文书
详解JavaScript中的执行上下文及调用堆栈
2021/04/29 Javascript
oracle连接ODBC sqlserver数据源的详细步骤
2021/07/25 Oracle