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


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 写的简单进度条控件
Jan 22 Javascript
一个可绑定数据源的jQuery数据表格插件
Jul 17 Javascript
JavaScript的类型转换(字符转数字 数字转字符)
Aug 30 Javascript
js+flash实现的5图变换效果广告代码(附演示与demo源码下载)
Apr 01 Javascript
JS及PHP代码编写八大排序算法
Jul 12 Javascript
ionic实现带字的toggle滑动组件
Aug 27 Javascript
Angular 应用技巧总结
Sep 14 Javascript
微信公众号-获取用户信息(网页授权获取)实现步骤
Oct 21 Javascript
bootstrapvalidator之API学习教程
Jun 29 Javascript
angular基于ng-alain定义自己的select组件示例
Feb 23 Javascript
JavaScript学习教程之cookie与webstorage
Jun 23 Javascript
JS表单验证插件之数据与逻辑分离操作实例分析【策略模式】
May 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最常用的ini函数分析 针对PHP.ini配置文件
2010/04/22 PHP
微信公众平台开发关注及取消关注事件的方法
2014/12/23 PHP
php+mysql结合Ajax实现点赞功能完整实例
2015/01/30 PHP
通过修改referer下载文件的方法
2008/05/11 Javascript
JS关键字变色实现思路及代码
2013/02/21 Javascript
javascript获取鼠标位置部分的实例代码(兼容IE,FF)
2013/08/05 Javascript
自定义jquery模态窗口插件无法在顶层窗口显示问题
2014/05/29 Javascript
javascript弹出带文字信息的提示框效果
2016/07/19 Javascript
javascript数据结构之串的概念与用法分析
2017/04/12 Javascript
完美解决浏览器跨域的几种方法(汇总)
2017/05/08 Javascript
你有必要知道的10个JavaScript难点
2017/07/25 Javascript
JavaScript基础进阶之数组方法总结(推荐)
2017/09/04 Javascript
vue+axios+element ui 实现全局loading加载示例
2018/09/11 Javascript
Javascript实现秒表倒计时功能
2018/11/17 Javascript
vue 使用外部JS与调用原生API操作示例
2019/12/02 Javascript
vue中echarts的用法及与elementui-select的协同绑定操作
2020/11/17 Vue.js
Django使用Celery异步任务队列的使用
2018/03/13 Python
Python中的pathlib.Path为什么不继承str详解
2019/06/23 Python
python3获取文件中url内容并下载代码实例
2019/12/27 Python
python爬虫使用scrapy注意事项
2020/11/23 Python
美国一家著名的儿童鞋制造商:Stride Rite
2017/01/02 全球购物
澳大利亚领先的美容护肤品零售商之一:SkincareStore
2018/01/22 全球购物
新西兰床上用品和家居用品购物网站:Adairs
2018/04/27 全球购物
英国马匹装备和马术用品购物网站:Equine Superstore
2019/03/03 全球购物
丝芙兰墨西哥官网:Sephora墨西哥
2020/05/30 全球购物
广州一家公司的.NET面试题
2016/06/11 面试题
英语专业推荐信
2013/11/16 职场文书
广播体操口号
2014/06/18 职场文书
高中生旷课检讨书
2014/10/08 职场文书
小学三八妇女节活动总结
2015/02/06 职场文书
党员发展大会主持词
2015/07/03 职场文书
实习报告范文
2019/07/30 职场文书
Centos环境下Postgresql 安装配置及环境变量配置技巧
2021/05/18 PostgreSQL
Python爬虫实战之爬取携程评论
2021/06/02 Python
电脑开机弹出documents文件夹怎么回事?弹出documents文件夹解决方法
2022/04/08 数码科技
vue实力踩坑之push当前页无效
2022/04/10 Vue.js