小程序开发小问题归纳
盒模型默认为W3C
1
2
| box-sizing: content-box
box-sizing: border-box
|
相对定位
父元素是相对定位，子元素的绝对定位才生效
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)
}
})
|
属性给另一对象
wx:for循环内循环
1
| <view wx:for="XX" wx:key="xx" wx:for-item="aaa" wx:for-index="bbb"></view>
|
自适应宽高
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
|
