开发一个uniapp多端兼容组件注意事项
1、尽量使用背景图片代替img标签,一定要使用图片一定要require引入2、vue传参数据尽量结构简单,复杂数据容易出错3、弹窗唤起使用class控制,尽量不要使用v-if。常用显示方法methods:{show(){this.showPicker = true;},hide(){this.showPicker = false;},...
·
1、尽量使用背景图片代替img标签,一定要使用图片一定要require引入
2、vue传参数据尽量结构简单,复杂数据容易出错
3、弹窗唤起使用class控制,尽量不要使用v-if。
常用显示方法
methods:{
show(){
this.showPicker = true;
},
hide(){
this.showPicker = false;
},
}
页面调用
<Picker ref="picker" @submit="submit"></Picker>
this.$refs.picker.show()
样式
.picker{
transition: all 0.3s ease;
transform: translateY(100%);
}
.show {
transform: translateY(0);
}
4、全部使用flex布局,避免使用浮动
5、input输入框uniapp自带样式,调整高度后各平台表现不一样,建议使用样式调整下级所有元素
input{
*{
height: 100upx;
line-height:100upx;
}
}
更多推荐
已为社区贡献1条内容
所有评论(0)