小程序开发注意点儿,新手入门基础
1、域名配置,不配置无法访问
小程序开发,要调用API,就必须把域名填写在配置里面,这点儿一定要记住,万一服务端突然上线一次,发现线上服务出问题了,很有可能就是域名没有配置。
2、默认宽度
小程序中推荐使用rpx做为单位(当然你用px和em照样起作用),默认页面宽度是750rpx,所以,UI同学在给设计稿时,建议也是这个尺寸。
3、图片预览地址必须是http地址
小程序可以引用相对路径的图片,但是,需要预览,下载时,请一定要作用http地址,否则无效。
wx.previewImage({
current: '', // 当前显示图片的http链接
urls: [] // 需要预览的图片http链接列表
})
4、使用字体图标
在PC上有不少同学都使用过图标字体,对于喜欢使用图标字体的同学来说,当然希望小程序中也能使用。然后,我也专门搜索了一圈,果然有高人已经在小程序中使用上了图标字体,了解详情,请点击:http://www.soswen.com/article/10
5、开启debug模式
有些时候,需要在手机上进行调度,想查看一下日志,怎么办?
可以把下面的代码放在onload里面去,这样就方便调度了~
// 开启debug,线上会一并开启
wx.setEnableDebug({
enableDebug: true
})
6、设置标题
需要获取数据后,再设置title?你可以用如下写法:
var title = '详情页'; // 这是从服务端返回的数据
wx.setNavigationBarTitle({
title: title
})
7、公用CSS & js
对于公用CSS,我们可以写在app.wxss中,公用JS,可以写在util目录下,方便其他文件进行调用
.button.light {
background-color: #a0e2fb;
color: #e5f7fe;
}
.button.gray {
background-color: #dfdfdf;
color: #b0b0b0;
}
8、requie其他JS
引用其他JS,可以使用requie,比如:
var util = require('../../utils/util.js');
9、动态删除评论
小程序里面是没有节点的插入和删除的,只能通过show,hide来实现,这里说一下评论内容比较多的时候如何删除评论?
JS
Page({
data: {
itemHide: {}
},
deleteComment: function(e){
var index = e.currentTarget.dataset.index;
var itemHide = self.data.itemHide;
itemHide[index] = true;
self.setData({
itemHide: itemHide
})
}
})
wxml
<view wx:for="{{comments}}" wx:key="c_id" wx:if="{{!itemHide[index]}}">
...
<button class="delete" bindtap="deleteComment" data-index="{{index}}" form-type="submit">
<image src="/images/delete_gray.png" />
</button>
</view>
10、处理重复点击
之前发过一遍这个解决方法,详细可以查看飞君同学的这篇文章:http://www.jianshu.com/p/b27157ea61fb
11、长按保存
相信大家都习惯看到二维码就长按识别,微信已经培养了我们这种使用习惯,但是,小程序里面并没有长按识别二维码功能(不明白为什么不开放这功能)。对于用户来说,习惯了长按,这时候我们可以做一个长按保存二维码到手机的功能,直接监听bindlogntab事件,调用保存图片API:
wx.saveImageToPhotosAlbum({
success(res) {
}
})
12、IOS下文字间距和安卓区别
这个问题是今天遇到的一个坑人问题,做了一个左右布局,左侧图片,右侧文字。代码写完后,发现安卓正常,但是IOS下右侧明显比左侧高。因为字体,字号都一样,纠结了一会儿,设置了line-height: 1;然后就OK了。看来小程序的reset没做好呀~
13、开发者社区
有所有问题,都可以先到开发者社区去找一下,或许别人已经踏过坑了:
https://developers.weixin.qq.com/
待续...
- 51Nod 1632 B君的连通(递归,快速幂)
- 51Nod 1046 A^B Mod C(日常复习快速幂)
- EntityFramework 外键值映射
- Codeforces 626C Block Towers(二分)
- 51Nod 1004 n^n的末位数字(日常复习快速幂,莫名的有毒,卡mod值)
- kmp模版
- 触发器在渗透中的利用
- Codeforces 626B Cards(模拟+规律)
- Android 5.0屏幕录制漏洞(CVE-2015-3878)威胁预警
- Codeforces 626A Robot Sequence(模拟)
- BZOJ 2038: [2009国家集训队]小Z的袜子(hose)【莫队算法裸题&&学习笔记】
- [接口测试 - 基础篇] 01 你应该了解的协议基础
- Uva - 12050 Palindrome Numbers【数论】
- [接口测试 - http.client篇] 14 源码初探及其工作机制分析
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- MagicEXIF(元数据编辑器)
- 9个 SSH常用命令选项
- DietPi折腾记
- DietPi配置问题(1)
- DietPi配置问题(2)
- 什么是死锁?如何解决死锁?
- Mac终端配置oh-my-zsh
- 聊聊dubbo-go的leastActiveLoadBalance
- ThreadLocal与InheritableThreadLocal
- 每天学点JavaScript基础(1)—— null 和 undefined
- 每天学点JavaScript基础(2)——JavaScript里的分号,你加还是不加?
- Flutter中async与await异步编程原理分析
- 在树莓派上使用360WIFI
- Orange PI Zero OpenWrt固件
- 定制用于日常使用的树莓派系统