乐趣区

关于uni-app:关于uni-开发跨平台App的坑

1.uni.share()问题,分享图文时,图片不显示?

解决办法: 将图片大小进行解决,大概为 20k,应用腾讯云 oss 图片地址增加 ‘?imageView2/2/w/100/h/100/q/60’, 进行品质压缩,根本能够应用

2.uni 对于组件款式兼容微信小程序的坑

// 自定义组件 在微信小程序无奈失效的问题
// 须要在组件内减少属性

解决办法:

export default {options: { styleIsolation: 'shared'}, // 将属性失效至页面
}

3. 对于 uni-app input 组件无奈监听 keyup.enter 事件问题

解决办法:

<input class="search_input" type="text"
    placeholder-class="search_placeholder" 
    placeholder="搜寻资讯题目, 关键词"
    v-model="queryParams.keyword"
    confirm-type="search" @confirm="handleSearch" />    
// 最初一句 confirm-type="search" 最为重要

4. 对于 uni 自适应 rpx 在 ipad pro 不失效问题

解决办法:

须要在 pages.json 中
globalStyle 字段下进行非凡配置

"globalStyle": {
    "navigationBarTextStyle": "white",
    "navigationBarTitleText": "uni-app",
    "navigationBarBackgroundColor": "#007AFF",
    "backgroundColor": "#FFFFFF",
    "rpxCalcMaxDeviceWidth": 960, // rpx 计算所反对的最大设施宽度,单位 px,默认值为 960
    "rpxCalcBaseDeviceWidth":1024, // rpx 计算应用的基准设施宽度,设施理论宽度超出 rpx 计算所反对的最大设施宽度时将按基准宽度计算,单位 px,默认值为 375
    "rpxCalcIncludeWidth": 750 // rpx 计算非凡解决的值,始终按理论的设施宽度计算,单位 rpx,默认值为 750
}

5. 对于 uni canvas 各类问题

canvas 操作时 尤其是 canvasGetImageData、canvasPutImageData
其 width、height 特地留神 整数 以及 边界值 ,极有可能造成 fail,
在进行图片变色 canvasPutImageData 时,
微信小程序 兼容上会有通明局部 间接将底色笼罩景象,h5 以及 app 失常,
须要将图片信息获取之后 拼接到另一个 canvas 实现背景色浮现,
uni.createCanvasContext(canvasId,this);
uni.canvasGetImageData(Object,this);
uni.canvasPutImageData(Object,this);
三个 this 很重要,遗记增加 及其容易产生 bug

6. 对于 scroll-view 应用 flex 布局 主动填充宽高 flex:1 时,极有可能达不到想要的成果:

解决办法:

在 scroll-view 外层设置一个 view , 给 view 应用 flex 布局,并且增加 flex:1 属性,scroll-view 款式 设置为 width:100%;height:100%; 即可;
退出移动版