- css设置z-index不生效:让z-index起作用有个小小前提,就是元素的position属性要是relative,absolute或是fixed。
- 条件渲染样式
:class=“isAllocate ? ‘scroll’ : ‘scroll-view’”
:class="[{‘left’: index == 0}, {‘right’: index === dateClass -1}]" - 微信小程序placeholder设置自定义颜色
<input @confirm="confirm" v-model.trim="couponCode" placeholder="请输入劵号" placeholder-class="place-font"/>
- 小程序原生组件不支持:nth-child()伪类
- text标签不可以滚动,需要滚动使用 scroll-view
- box-image和box-radius同时出现
方法一:
.border {
position: relative;
border: 4px solid transparent;
border-radius: 16px;
background: linear-gradient(orange, violet);
background-clip: padding-box;
padding: 10px;
}
.border::after {
position: absolute;
top: -4px;
bottom: -4px;
left: -4px;
right: -4px;
background: linear-gradient(red, blue);
content: '';
z-index: -1;
border-radius: 16px;
}
方法二:在当前div外面包裹一层div
.one {
width: 300px;
height: 100px;
border-radius: 25px;
overflow: hidden;
}
.box {
border: 30px solid;
border-image: linear-gradient(red, yellow) 10;
}
- mpvue要善用watch(监听属性)和computed(计算属性,变量不用再data中定义)方法
- 去除小程序button的默认边框
button::after{
border:none;
}
- 上传文件到服务器 uploadFile()
请求相关后台api需要在请求头中设置authorization进行授权
static uploadFile (filePath) {
if (this.isWx) {
return new Promise((resolve, reject) => {
wx.uploadFile({
url: config.baseURL + 'bc/v1/storage',
filePath,
header: {
authorization: this.getStorageSync(`token`)
},
name: 'file',
success (res) {
resolve(JSON.parse(res.data))
},
fail (err) {
reject(err)
}
})
})
}
}