1:input组件placeholder字体颜色
写在placeholder-class里面的color并不生效,需要写在placeholder-style里面;
<input class="account-input input-ext"
value="{{accountValue}}"
auto-focus maxlength="11"
type="number"
placeholder="请输入账号"
placeholder-style="color:#cecece;"
bindinput="bindAccoountInput">
</input>
2:Button定义后有灰色边框
去掉使用:
<view class="logout" bindtap="logout">
<button type="primary" >退出登录</button>
</view>
button::after{
border:0
}
3:样式注意:静态使用class 动态使用style
4:页面跳转传参和接参
onLogFilterHandler(){
var that = this
wx.navigateTo({
url: '/pages/construction_log/log_filter/log_filter?type=1&haveFilterData='+
encodeURIComponent(JSON.stringify(that.filterData)),
events: {
callback(result){
if(Judge.isNonNullMap(result)){
that.filterData = result
}else{
that.filterData = {}
}
that.onResetData()
}
}
})
},
onLoad(options) {
console.log('options',options)
}
5:页面跳转接收参数错误
问题:
案例和解决方案:
onLogFilterHandler(){
var that = this
wx.navigateTo({
url: '/pages/construction_log/log_filter/log_filter?type=1&haveFilterData='+
encodeURIComponent(JSON.stringify(that.filterData)),
events: {
callback(result){
if(Judge.isNonNullMap(result)){
that.filterData = result
}else{
that.filterData = {}
}
that.onResetData()
}
}
})
},
onChangeData(data){
let type = Number(data.type)
let haveFilterData ;
if(data.haveFilterData!=undefined){
haveFilterData = JSON.parse(decodeURIComponent(data.haveFilterData))
}
}
6:回调函数相关
this.events.emit(‘callback’,result)
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
this.events = this.getOpenerEventChannel()
this.initPeriod()
this.onUpdateLevel()
this.onChangeData(options)
},
onLogFilterHandler(){
var that = this
wx.navigateTo({
url: '/pages/construction_log/log_filter/log_filter?type=1&haveFilterData='+
encodeURIComponent(JSON.stringify(that.filterData)),
events: {
callback(result){
if(Judge.isNonNullMap(result)){
that.filterData = result
}else{
that.filterData = {}
}
that.onResetData()
}
}
})
},
7:页面刷新
在onShow()中监听执行
8:频繁切换组织后,tab显示问题
<view style="height: {{categoryHeight}}px;">
<l-tabs swipeable="true"
style="height: {{categoryHeight}}px;"
l-active-class="l-active-class"
l-inactive-class="l-inactive-class"
l-line-class="l-line-class"
l-header-line-class ="l-header-line-class"
bind:linchange="goToPage">
<block wx:for="{{tabs}}" wx:key="id">
<l-tabpanel tab="{{item.name}}" key="{{item.id}}" slot="{{item.id}}">
<statistics_view tabId="{{item.id}}"/>
</l-tabpanel>
</block>
</l-tabs>
</view>
<view wx:if="{{tabId==0}}" class="day-container">
<block wx:for="{{proheader}}" wx:key="index">
<view>{{item}}</view>
</block>
</view>
<view wx:if="{{tabId==1}}" class="day-container">
<block wx:for="{{dayHeader}}" wx:key="index">
<view>{{item}}</view>
</block>
</view>
<view wx:if="{{tabId==2}}" class="day-container">
<block wx:for="{{monthHeader}}" wx:key="index">
<view>{{item}}</view>
</block>
</view>
<view wx:if="{{tabId==3}}" class="day-container">
<block wx:for="{{peopleHeader}}" wx:key="id">
<view>{{item}}</view>
</block>
</view>
9:页面之间传参
使用data - 。
注意的是:在接收的时候,会统一转化为小写。
10:组件参数传递尽量不要使用关键字或者标识符(例如id等)
11:上传图片
使用微信小程序的uploadFile。
name:为file
wx.uploadFile({
filePath: filePath,
name: 'file',
url: url,
header: defaultHeader,
formData: params,
success: success,
fail: fail
})
12:版本问题(尽量使用最新版本例如canvas、 wx.chooseMedia等等)
13:页面引入
WXML 提供两种文件引用方式import和include。
14:地图的使用
1:直接使用就可以使用腾讯地图
2:当前经纬度可以显示当前地图位置
longitude="108.31343"
latitude="22.83393"
3:地图标点(注意:markers必须是数组,是对象的话不起作用)
markers是数组形式
4:自定义气泡显示
在这里插入代码片<map class="page"
id="towerMap"
latitude="{{latitude}}"
longitude="{{longitude}}"
scale="{{scale}}"
markers="{{markers}}"
bindcallouttap="calloutTap"
bindregionchange="regionChange"
bindupdated="updatedMap"
>
<cover-view slot="callout" >
<block wx:for="{{markers}}" wx:key="index" >
<cover-view class="custom-callout" style="padding-right:{{item.showClickName ? '0rpx': '16rpx'}}" marker-id="{{item.id}}" >
<cover-view class="call-name-text" >{{item.groupName}}</cover-view>
<cover-view class="call-pro-text" wx:if="{{item.showClickName}}">{{item.projectCount}}</cover-view>
</cover-view>
</block>
</cover-view>
</map>
15:uchart的使用
1:地图会频繁都动的问题
opts{
update: true,
}
备注:方案一 (可能会有别的方案)
2:地图x轴数字太长换行的问题(format暂时不起作用)
xAxis: {
rotateLabel:true,
rotateAngle:45
}