1、日期格式问题
使用uniapp开发过程中,有这么一段代码,将两个时间字符串通过JS的date构造函数,构造出两个日期并比较大小,在Android平台没有问题,在ios上就出现了日期比较失败,无法执行正常的校验。
ios中不支持-作为日期之间的分隔符,需要使用/。使用replaceAll替换掉日期字符串中的-就好了。
参考文献
进阶之路-前端:ios对new Date() 的兼容问题
2、输入框click事件
禁用状态下载input组件,在android平台可以正常监听click事件,在ios上click监听异常
3、 给placeholder绑定动态变量
<u-input v-model="form.selectDocumentType" class="choiceInput" :placeholder="selectDocumentTypeLabel"/>
4、form表单中关于一条form-item中多个必填项的prop设置
具体解决方法是在中再包裹一层
<u-form-item label="证件类型" prop="selectDocumentType">
<view>
<u-input v-model="form.selectDocumentType" class="choiceInput" :placeholder="selectDocumentTypeLabel"/>
</view>
<view class="typeContainer">
<u-form-item prop="typeNumber">
<u-input v-model="form.typeNumber" class="choiceInput" />
</u-form-item>
</view>
</u-form-item>
5、uview的select组件,数据是对的却一直报Cannot read property ‘children‘ of undefined
是因为children:[]为空,我们可以改成
"children": [
{
"value": null,
"label": ""
}
]
6、自定义导航栏
在pages.json文件内,将你想要自定义导航栏的内容修改成如下:“navigationStyle”:“custom”
{
"path": "pages/buyProduct/add",
"style": {
"navigationStyle":"custom"
}
}
7、在App.vue页面获取高度
onLaunch: function() {
console.log('App Launch')
uni.getSystemInfo({
success: function(e) {
// #ifndef MP
Vue.prototype.StatusBar = e.statusBarHeight;
if (e.platform == 'android') {
Vue.prototype.CustomBar = e.statusBarHeight + 50;
} else {
Vue.prototype.CustomBar = e.statusBarHeight + 45;
};
// #endif
// #ifdef MP-WEIXIN
Vue.prototype.StatusBar = e.statusBarHeight;
let custom = wx.getMenuButtonBoundingClientRect();
console.log(e.statusBarHeight)
console.log(custom)
Vue.prototype.Custom = custom;
Vue.prototype.CustomBar = (custom.top - e.statusBarHeight)*2 + custom.height;
// #endif
// #ifdef MP-ALIPAY
Vue.prototype.StatusBar = e.statusBarHeight;
Vue.prototype.CustomBar = e.statusBarHeight + e.titleBarHeight;
// #endif
}
})
initApp();
}
8、uniapp官网示例引入css的方法是错误的
按下面这种写法即可解决
@import '@/common/common.scss';
9、小程序onLaunch和onload先后顺序
10、uniapp 滑太快到底部@scrolltolower没触发,再滑动一下触发2次
11、写position: fixed,在ios下会有兼容性问题
12、uniapp(Vue)修改对象或数据,页面没有相应更改
原因:
Vue 不允许在已经创建的实例上动态添加新的根级响应式属性, Vue 无法探测普通的新增属性
13、关于修改对象
可以使用 Vue.set(object, propertyName, value) 方法向嵌套对象添加响应式 property
Vue.set(vm.someObject, 'b' ,2)
//或者
his.$set(this.someObject, 'b', 2)
14、关于修改数组
可以使用 splice:
vm.items.splice(newLength)
15、微信小程序 CSS border-radius元素 overflow:hidden失效问题 (iPhone ios 苹果兼容)
解决方法:
父元素设置以下两个属性:
backface-visibility: hidden; transform: translate3d(0, 0, 0);
16、小程序页面内含scroll-view时,在scroll-view组件外滑一下页面,会出现1-2秒卡死状态
方法一、页面设置position:fixed,固定
方法二、设置整体不能上下滚动
"disableScroll":true, //微信小程序
"mp-alipay": {
"allowsBounceVertical":"NO" //支付宝小程序
}
17、跳转tabBar请用 switchTab(OBJECT),跳转到 tabBar 页面
-
navigateTo:fail can not navigateTo a tabbar page
//正常
uni.switchTab({
url:'/pages/home/home'
})
//报错
// uni.navigateTo({
// url: '/pages/home/home'
// })
18、多层跳转页面路由问题
//一开始是这样写的
uni.navigateTo({
url: '/pages'
})
//改成这样写就OK
uni.redirectTo({
url: '/pages'
})
19.文本在view内自动换行
word-wrap: break-word;
word-break: break-all;
white-space: pre-line;
20. ReferenceError: require is not defined 或者是 切换tabbar报错__call_hook导致页面白屏的时候
解决方式:把之前的代码删掉重新贴一遍就好了,不知道是uniapp还是HB编辑器的问题,就特么很神奇的好了。