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


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 相关文章推荐
由Javascript实现的页面日历
Nov 04 Javascript
jquery修改网页背景颜色通过css方法实现
Jun 06 Javascript
分享15个大家都熟知的jquery小技巧
Dec 02 Javascript
jQuery简单入门示例之用户校验demo示例
Jul 09 Javascript
Bootstrap fileinput文件上传组件使用详解
Jun 06 Javascript
Vue实现百度下拉提示搜索功能
Jun 21 Javascript
最基础的vue.js双向绑定操作
Aug 23 Javascript
vue获取当前激活路由的方法
Mar 17 Javascript
vuejs点击class变化的实例
Sep 05 Javascript
vue+axios实现文件下载及vue中使用axios的实例
Sep 21 Javascript
jQuery创建折叠式菜单
Jun 15 jQuery
Angular封装表单控件及思想总结
Dec 11 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中实现xml与mysql数据相互转换的方法
2014/12/25 PHP
详解配置 Apache 服务器支持 PHP 文件的解析
2017/02/15 PHP
PHP实现UTF8二进制及明文字符串的转化功能示例
2017/11/20 PHP
Laravel 5.5 异常处理 &amp; 错误日志的解决
2019/10/17 PHP
在jQuery 1.5中使用deferred对象的代码(翻译)
2011/03/10 Javascript
js,jQuery 排序的实现代码,网页标签排序的实现,标签排序
2011/04/27 Javascript
左右悬浮可分组的网站QQ在线客服代码(可谓经典)
2012/12/21 Javascript
JS实现闪动的title消息提醒效果
2014/06/20 Javascript
原生javascript实现拖动元素示例代码
2014/09/01 Javascript
Jquery UI实现一次拖拽多个选中的元素操作
2020/12/01 Javascript
bootstrap weebox 支持ajax的模态弹出框
2017/02/23 Javascript
Angular 4环境准备与Angular cli创建项目详解
2017/05/27 Javascript
vue增删改查的简单操作
2017/07/15 Javascript
浅析JS中常用类型转换及运算符表达式
2017/07/23 Javascript
前端必备插件之纯原生JS的瀑布流插件Macy.js
2017/11/22 Javascript
nuxt+axios实现打包后动态修改请求地址的方法
2020/04/22 Javascript
JavaScript用document.write()输出换行的示例代码
2020/11/26 Javascript
[04:16]DOTA2英雄梦之声_第09期_斧王
2014/06/21 DOTA
[32:17]完美世界DOTA2联赛循环赛LBZS vs Forest第二场 10月30日
2020/10/31 DOTA
Python实现扫描指定目录下的子目录及文件的方法
2014/07/16 Python
Python实现针对中文排序的方法
2017/05/09 Python
python用户管理系统
2018/03/13 Python
python pandas 对series和dataframe的重置索引reindex方法
2018/06/07 Python
python实现贪吃蛇小游戏
2020/03/21 Python
python游戏开发之视频转彩色字符动画
2019/04/26 Python
使用Python做定时任务及时了解互联网动态
2019/05/15 Python
关于python中密码加盐的学习体会小结
2019/07/15 Python
在tensorflow中实现屏蔽输出的log信息
2020/02/04 Python
英国安全产品购物网站:The Safe Shop
2017/03/20 全球购物
伊芙丽官方旗舰店:中国淑女一线品牌
2017/12/01 全球购物
幼儿园毕业寄语
2014/04/03 职场文书
社团个人总结范文
2015/03/05 职场文书
考生诚信考试承诺书
2015/04/29 职场文书
上课迟到检讨书
2015/05/06 职场文书
毕业论文致谢词
2015/05/14 职场文书
2016年庆“七一”主题党日活动总结
2016/04/05 职场文书