- 微信小程序开发一定要设置实际宽度
- 使用images一定设置宽-
- 使用背景图片(
background-image)需要引入线上链接http... - 注意判断类型
<text class="video_title">
{{lisVidindex !=='' ? listData[lisVidindex].name:'暂无视频'}}
</text>
注意：！=’‘和！==’‘的结果不同，!=’‘会把0也包含在内，让你损index=0的数据
自定义微信小程序的swiper
通过改变当前的current--当前所在滑块的 index来实现！其他功能相同原理！网页版样式变化一般通过jq添加类或者动画，微信小程序不能使用jq，所以通过布尔值控制状态来添加类名，需要、动画可以使用@key关键帧
{{iszfmodal?'mdlbox_show':'mdlbox_hide'}}获取最新的数据使用this.setdata()的回调函数/this.setdata()异步问题
this.setData({
//...
},() => {你获取最新数据要干的事情、调去某个函数}
})
- 点击切换动画
A :原理：利用this.setdata()的回调函数和定时器改变布尔值来增加删除类名从而达到效果
/* 动画 */
//xx.wxss
.antonaimate需要加的动画{
opacity: 0;
transform: translateX(-40rpx) !important;
/* transition: all 0.3s linear; */
}
.tab_item_content需要加动画的类{
transform: translateX(0);
transition: all 0.3s linear;
}
// xx.wxml
<view class="tab_item_content {{isopacity?'antonaimate':''}}">
一些需要动画的内容
</view>
//xx.js
onChangCyTab(optain){
let that = this;
that.setData({isopacity:true},()=>{
setTimeout(()=>{ that.setData({isopacity:false})},500);
//改变文案、手机展示、小tab选项
})
},
- 微信小程序 border-radius overflow不生效
//其实就是兼容问题
-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
video控件属性不起作用（查了好多帖子qaq）
如：微信小程序video隐藏状态栏
需要在xx.js的data里设置属性的变量值再赋值过去,直接在wxml里写属性值如false无效微信小程序禁止page或者其他标签滚动
//xx.js
//禁止page滚动，给你调用的函数方法加
wx.setPageStyle({
style: {
overflow: 'hidden'
}
})
//xx.wxml
//禁止不含滚动需求的标签滚动，给标签加行内属性
<view catchtouchmove="ture">
- 在微信小程序内获取一个标签的值：通过给该标签绑定属性
data-xxx=''，然后在点击时通过点击对象e，来获取这个值
<view data-xxx="{{item.title}}" bindtap="goPage">{{item.title}}</view>
//xx.js
goPage(e){
console.log(e,'ppp')
let value = e.currentTarget.dataset.xxx;
}
- 获取swiper轮播变动后当前current值
给swiper添加该方法bindchange
- 用变量设置style的值,或者变量需要通过计算得出style的值
<view style="width:{{comment_list.avg_fenshu*20}}%;"></view>
- wx:for 控制循环的个数
<view wx:for="{{list}}" wx:if="{{index <3}}" wx:key="index">
</view>
- 页面切换更换头部标题
wx.setNavigationBarTitle({
title: 'xxxxx公司' //页面切换，更换页面标题
})
- 换行符
微信小程序里换行符不管用，需要使用\n和style="white-space: pre-wrap;"
//eg
<view style="white-space: pre-wrap;">
左\n滑\n查\n看\n全\n部
</view>
- 标签含有多个情况的判断 全用wx：if，不用else
