Voyz's Studio.

小程序开发小问题归纳

字数统计: 452阅读时长: 2 min
2019/05/13 Share

小程序开发小问题归纳

盒模型默认为W3C

1
2
box-sizing: content-box	  //w3c模型
box-sizing: border-box //IE模型

相对定位

父元素是相对定位,子元素的绝对定位才生效

scroll-view 横向滚动

1
2
3
4
5
6
7
scroll-view{
scroll-x width:100%;
white-space:nowrap;
}
.item{
dispaly:inline-block;
}

scroll-view中超出文本不换行问题

小程序scroll-view 不支持flex,默认为block

1
2
3
4
5
6
7
8
9
10
11
12
13
14
//由于croll-view上设置了 white-space:nowrap;导致文字不换行
.scroll_txt{
display:-webkit-box;
overflow:hidden;
text-overflow:ellipsis;
word-wrap:break-word;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
white-space:normal !important;
}
父级元素{
overflow:hidden;
}

String to Double类型

1
parseFloat(str_num).toFixed(2)

获取经纬度

1
2
3
4
5
6
wx.getLocation({
success:function(res){
console.log(res.latitude)
console.log(res.longitude)
}
})

属性给另一对象

1
2
var { a,b,c } = obj;
var obj2 = { a,b,c };

wx:for循环内循环

1
<view wx:for="XX" wx:key="xx" wx:for-item="aaa" wx:for-index="bbb"></view>

自适应宽高

1
width:fit-content

scroll-view横向滚动时,开发工具显示正常,在手机测试时子元素错位

1
2
3
子元素{
vertical-align:top;
}

小程序间跳转

1
2
<navigator target = "miniProgram" app-id="wx18a2ac992306a5a4" path="pages/apps/largess/detail?accountId=2849563" open-type='navigate'>  
</navigator>

小程序分包

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
目录结构:
├── app.js
├── app.json
├── app.wxss
├── packageA
│ └── pages
│ ├── cat
│ └── dog
├── packageB
│ └── pages
│ ├── apple
│ └── banana
├── pages
│ ├── index
│ └── logs
└── utils

app.json:
{
"pages": ["pages/index", "pages/logs"],
"subpackages": [
{
"root": "packageA",
"pages": ["pages/cat", "pages/dog"]
},
{
"root": "packageB",
"name": "pack2",
"pages": ["pages/apple", "pages/banana"]
}
]
}

判断对象中是否有某属性

1
2
'prop' in obj;  //原型链上有也是true
obj.hasOwnProperty('prop')

使用wxParse时导入wxParse.wxss

1
@import /wxParse/wxParse.wxss
CATALOG
  1. 1. 小程序开发小问题归纳