微信小程序 开发过程中遇到的坑(一)
- 2124
1.我们使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 的时候在pages中写注释的时候回报错。
例如:
{
"pages":[
//这是首页面
"pages/welcome/welcome"
]
}
此时就会报错
2.在json文件中没有写内容的时候也要加一对大括号{ },不然的话也会报错
3.
①在开发微信小程序的时候,我们使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径,窗口表现,设置网络超时时间,设置多Tab等。
以下是一个包含了所有配置选项的简单配置,app.json :
{
//设置页面路径
"pages": [
"pages/index/index",
"pages/logs/index"
],
//设置默认页面的窗口表现
"window": {
"navigationBarTitleText": "Demo"
},
//设置底部 tab 的表现
"tabBar": {
"list": [{
"pagePath": "pages/index/index",
"text": "首页"
}, {
"pagePath": "pages/logs/logs",
"text": "日志"
}]
},
//设置网络超时时间
"networkTimeout": {
"request": 10000,
"downloadFile": 10000
},
//设置是否开启 debug 模式
"debug": true
}
②但是在对页面json文件进行配置的时候只可以配置设置默认页面的窗口表现(即只能对window进行配置),但是在此时可以直接省略window,如果加window则没有效果,也不会报错。
以下是一个包含了window配置选项的简单配置,post.json :
注意:这是错误的写法
{
"window":{
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black",
"navigationBarTitleText": "微信接口功能演示",
"backgroundColor": "#eeeeee",
"backgroundTextStyle": "light"
}
}
注意:正确的写法
{
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black",
"navigationBarTitleText": "微信接口功能演示",
"backgroundColor": "#eeeeee",
"backgroundTextStyle": "light"
}
4.此前一直没有注意vertical-align: middle和height:40rpx;line-height:40rpx进行设置垂直剧中的区别,这次主要说一下vertical-align: middle
代码如下:
<view class="post-author-date">
<image class="post-author" src="../../images/avatar/1.png">
</image>
<text class="post-date">Nov 15 2016</text>
</view>
.post-author{
width: 60rpx;
height: 60rpx;
vertical-align: middle;
}
.post-date{
margin-top: 5rpx;
vertical-align: middle;
/*height: 40rpx;
line-height: 40rpx;*/
}
总结:
①vertical-align: middle;把此元素放在父元素的中部
②当一个父元素里面有多个子元素,需要把几个子元素水平对齐,并且每个子元素都垂直剧中的时候,对每一个子元素进行设置 vertical-align: middle
③height: 40rpx; line-height: 40rpx;可以对文本进行垂直居中
相关文章推荐
微信小程序 开发过程中遇到的坑(一)的更多相关文章
- 总结微信小程序开发中遇到的坑
总结微信小程序开发中遇到的坑,一些坑你得一个一个的跳啊,/(ㄒoㄒ)/~~ 1,页面跳转和参数传递实例 首先说一下我遇到的需求有一个我的消息页面,里面的数据都是后端返回的,返回的数据大致如下,有一个是 ...
- 微信小程序开发过程中tabbar页面显示的相关问题及解决办法!
在微信小程序的开发过程中如果有使用过tabbar的同学,我相信一定会遇到一些困扰.为什么有些时候代码中明明已经在app.json里面增加了tabbar,可以页面中就是不显示呢?可不可以有些页面显示ta ...
- 微信小程序开发过程中一些经验总结
1.微信开发者工具报错,微信小程序最低需支持tls1.2版本的问题 原因是服务器不支持ssl的高版本,解决方法: 在/etc/nginx/conf.d文件下,把"ssl_protocols ...
- 微信小程序开发过程中出现问题及解答
1.wx.uploadFile上传图片,控制台抛出错误"uploadFile:fail Error:Hostname/IP doesn't match certificate's altna ...
- 微信小程序 picker 中range-key的坑
<picker class='fr' bindchange="onChangeBuild" range-key="{{'num'}}" value=&qu ...
- 小程序——微信小程序初学踩过的坑
微信小程序初学踩过的坑 一.前言 最近因为某些需要和个人兴趣打算开发一下微信小程序,经过在官方网站上的基本了解,我大体知道了微信小程序开发的大致过程,其实最本质的就是MVVM,借用了很多模式上 ...
- 全栈开发工程师微信小程序-上(中)
全栈开发工程师微信小程序-上(中) width: 750rpx; 750rpx代表与屏幕等宽,rpx的缩写responsive pixel,这个单位是可以根据屏幕大小进行自适应调整的像素单位. 小程序 ...
- 解决微信小程序开发中wxss中不能用本地图片
微信小程序开发中wxss中不能用本地图片,我们可以用将我们的图片传到服务器上,然后直接引用在线地址.但是当我们没有服务器时,我们可以用"图床",这个具体可以百度.这里我们用第二种方 ...
- 【小程序开发】微信小程序开发中遇到的那些坑...
第一坑: 设置了三个tabBar,却默认显示第二个,不能展示我的第一个[首页]. "list": [{ "pagePath":"page/KTGJ/i ...
随机推荐
- oracle 12c 官方文档 及软件下载
oracle 12c 官方文档 http://www.oracle.com/pls/db121/homepage oracle 12c 软件下载 http://www.oracle.com/techn ...
- V-rep中的加速度计与陀螺仪
加速度计(Accelerometer) VREP的模型浏览器components→sensors中可以找到加速度计的模型,用于测量物体沿着世界坐标系三个坐标轴的加速度值. VREP中没有直接测量加速度 ...
- 基于源码编译安装openssh
最近的,openssl/openssh等相继漏洞的暴露,让暴露在公网的linux.沦陷为肉鸡的正营... 没办法,还是升级版本... 00.openssh简介 OpenSSH 是一组安全远程的连接工 ...
- 调用布局View的performClick()方法
修改之前的xml片段. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/an ...
- 修改谷歌云google cloud engine VM root账户的密码和允许远程ssh登录
Figured it out. The VM's in cloud engine don't come with a root password setup by default so you'l ...
- Swift 导航栏设置图片点击事件,图片蓝色的解决方案
如果导航栏想做一个点击事件,正好是一个图片 我们可以直接这样: self.navigationItem.rightBarButtonItem = UIBarButtonItem(image: UIIm ...
- Out of memory error : GC overhead limit exceeded
GC overhead limit exceeded 是指垃圾回收器通过分析当前内存使用趋势,提前抛出异常而不是真正等到内存耗尽再抛出异常.如果真正等到内存耗尽再抛出异常,可能的后果是:我们连保存重要 ...
- iptables中ULOG和NFLOG实现分析【转】
原文地址:http://blog.csdn.net/eydwyz/article/details/52456335 ----------原文如下---------------------------- ...
- du命令解决linux磁盘空间满的问题(很不错的哦)
首先你要确定是不是真正的是因为数据空间占满磁盘,经常是因为某个程序的日志占满了空间.当发现磁盘满了以后不要着急,使用以下命令从根目录开始排除查找哪个文件夹最大: du --max-depth=1 找到 ...
- 【web】a标签点击时跳出确认框
[web]a标签点击时跳出确认框 https://blog.csdn.net/michael_ouyang/article/details/52765575需求如下: 在跳转链接前,需要判断该用户是否 ...