找回密码
 立即注册

QQ登录

只需一步,快速开始

微信小程序综合交流

关注:59

所属分类: 微信开发 微信小程序综合交流

微信小程序用户交流版块,希望同学们积极发言,不过大家不要恶意发布广告哦!

[经验分享] 微信小程序 开发过程中遇到的坑

[复制链接]
查看: 181|回复: 1
最佳答案
0 

2

主题

2

帖子

52

积分

新人求带

积分
52
 楼主| 发表于 2017-12-6 10:33:38 | 显示全部楼层 |阅读模式
1.我们使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 的时候在pages中写注释的时候回报错。
例如:
  1. {
  2.   "pages":[
  3.       //这是首页面
  4.     "pages/welcome/welcome"
  5.   ]
  6. }
复制代码

此时就会报错
20170212155458230.png
2.在json文件中没有写内容的时候也要加一对大括号{ },不然的话也会报错
20170214212725331.png
3.
①在开发微信小程序的时候,我们使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径,窗口表现,设置网络超时时间,设置多Tab等。
以下是一个包含了所有配置选项的简单配置,app.json :
  1. {
  2.   //设置页面路径
  3.   "pages": [
  4.     "pages/index/index",
  5.     "pages/logs/index"
  6.   ],
  7.   //设置默认页面的窗口表现
  8.   "window": {
  9.     "navigationBarTitleText": "Demo"
  10.   },
  11.   //设置底部 tab 的表现
  12.   "tabBar": {
  13.     "list": [{
  14.       "pagePath": "pages/index/index",
  15.       "text": "首页"
  16.     }, {
  17.       "pagePath": "pages/logs/logs",
  18.       "text": "日志"
  19.     }]
  20.   },
  21.   //设置网络超时时间
  22.   "networkTimeout": {
  23.     "request": 10000,
  24.     "downloadFile": 10000
  25.   },
  26.   //设置是否开启 debug 模式
  27.   "debug": true
  28. }
复制代码

②但是在对页面json文件进行配置的时候只可以配置设置默认页面的窗口表现(即只能对window进行配置),但是在此时可以直接省略window,如果加window则没有效果,也不会报错。
以下是一个包含了window配置选项的简单配置,post.json :

注意:这是错误的写法
  1. {
  2.   "window":{
  3.     "navigationBarBackgroundColor": "#ffffff",
  4.     "navigationBarTextStyle": "black",
  5.     "navigationBarTitleText": "微信接口功能演示",
  6.     "backgroundColor": "#eeeeee",
  7.     "backgroundTextStyle": "light"
  8.   }
  9. }
复制代码

注意:正确的写法
  1. {
  2.     "navigationBarBackgroundColor": "#ffffff",
  3.     "navigationBarTextStyle": "black",
  4.     "navigationBarTitleText": "微信接口功能演示",
  5.     "backgroundColor": "#eeeeee",
  6.     "backgroundTextStyle": "light"
  7. }
复制代码

4.此前一直没有注意vertical-align: middle和height:40rpx;line-height:40rpx进行设置垂直剧中的区别,这次主要说一下vertical-align: middle
代码如下:
  1. <view class="post-author-date">
  2.     <image class="post-author" src="../../images/avatar/1.png">
  3.     </image>
  4.     <text class="post-date">Nov 15 2016</text>
  5. </view>

  6. .post-author{
  7.     width: 60rpx;
  8.     height: 60rpx;
  9.     vertical-align: middle;
  10. }
  11. .post-date{
  12.     margin-top: 5rpx;
  13.     vertical-align: middle;
  14.     /*height: 40rpx;
  15.     line-height: 40rpx;*/
  16. }
复制代码

总结:
①vertical-align: middle;把此元素放在父元素的中部
②当一个父元素里面有多个子元素,需要把几个子元素水平对齐,并且每个子元素都垂直剧中的时候,对每一个子元素进行设置 vertical-align: middle
③height: 40rpx; line-height: 40rpx;可以对文本进行垂直居中
回复

使用道具 举报

最佳答案
0 

0

主题

51

帖子

39

积分

新人求带

积分
39
发表于 2017-12-6 21:46:23 | 显示全部楼层
66666666666666666666666666666
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则



henkuai.com是专业的第三方微信开发者平台,为生态而生。


本站为第三方微信开发者平台,非腾讯官方网站。

天津市滨海新区
中新生态城中成大道生态建设公寓9号楼3层301

欢迎来这里一起喝喝茶,
聊聊你的产品。

微信公众号gongzhongkaifa

工作日12小时内回复。

广告推广
zhongcong@henkuai.com

工作日12小时内回复。

市场合作
songchang@henkuai.com