HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

iOS未检测到手机或模拟器

问题:windows10下使用hbuilderx2.9.8,iTunes12.11.0,连接苹果手机,显示未检测到手机或模拟器
解决:回退hbuilderx版本到2.8.13,iTunes使用版本 12.10.8.5

问题:windows10下使用hbuilderx2.9.8,iTunes12.11.0,连接苹果手机,显示未检测到手机或模拟器
解决:回退hbuilderx版本到2.8.13,iTunes使用版本 12.10.8.5

关于upx单位,旋转为横屏,再返回,在进入新页面,这个页面样式错乱的问题

横屏

我是使用了setTimeout 延迟1500毫秒后,目前观测可以解决该问题

setTimeout(function() {  
    plus.screen.lockOrientation("landscape-primary");  
    dosomething.....  
}, 1500)

我看别人解决方法是横屏页返回后先跳转到一个空白页在立即返回,也可解决

监听从横屏页返回后, 我跳转到一个空白页D, 空白页D在返回, 类似一个中转, 手动制造一次重进的操作
即 A -> B(横屏) -> A -> D(横屏B返回A后立即跳转空白页D,在返回A) -> A -> C (此时页面正常), 跳转空白页从肉眼看无感知

继续阅读 »

我是使用了setTimeout 延迟1500毫秒后,目前观测可以解决该问题

setTimeout(function() {  
    plus.screen.lockOrientation("landscape-primary");  
    dosomething.....  
}, 1500)

我看别人解决方法是横屏页返回后先跳转到一个空白页在立即返回,也可解决

监听从横屏页返回后, 我跳转到一个空白页D, 空白页D在返回, 类似一个中转, 手动制造一次重进的操作
即 A -> B(横屏) -> A -> D(横屏B返回A后立即跳转空白页D,在返回A) -> A -> C (此时页面正常), 跳转空白页从肉眼看无感知

收起阅读 »

条件编译的一点小建议

自行扩展条件编译平台 条件编译

目前的条件编译语句有 #ifdef 、#ifndef ,以 #endif;总感觉不太舒服,虽然完全可以实现所有的目标,总感觉缺少了点什么,建议加入 #elseif、#else这样就完美了.
例如:
#ifdef H5
...
#endif
#ifdef APP
...
#endif
#ifndef H5 || APP
...
#endif
这样写起来总感觉有点繁琐.如果加入了#elseif 和 $else就方便多了.写起来比较简洁
#ifdef H5
...
#elseif APP
...
#else
...
#endif
这样立马减少了很多代码行.而看起来也比较舒服.

大概意思就是这么个.如有错误的地方请包涵. 望采纳.

继续阅读 »

目前的条件编译语句有 #ifdef 、#ifndef ,以 #endif;总感觉不太舒服,虽然完全可以实现所有的目标,总感觉缺少了点什么,建议加入 #elseif、#else这样就完美了.
例如:
#ifdef H5
...
#endif
#ifdef APP
...
#endif
#ifndef H5 || APP
...
#endif
这样写起来总感觉有点繁琐.如果加入了#elseif 和 $else就方便多了.写起来比较简洁
#ifdef H5
...
#elseif APP
...
#else
...
#endif
这样立马减少了很多代码行.而看起来也比较舒服.

大概意思就是这么个.如有错误的地方请包涵. 望采纳.

收起阅读 »

uni.requestPayment支付宝支付成功后的回调,返回的结果数据格式有问题

uniapp

如题,在用 uniapp做APP的时候,需要用到支付,在用uni.requestPayment的时候,一切都很顺利,成功后,后端说要给他支付宝返回的订单号(trade_no),本以为正常可以拿到,结果,JSON.stringify把结果打印出来之后,放进json.cn里面根本没法正常转义,一层一层刨开发现对象里面多了一句话,如图。红框框起来的都是多余的,包括花括号,去掉就可以正常字符串转对象。真的拉胯,字符串太长了,不想看,一直以为返回结果没问题,弄了半天~~

希望官方看到后能处理一下!!!

附解决方案代码:
pullUpPay(provider, orderInfo) {
let that = this
uni.requestPayment({
provider: provider,
orderInfo: orderInfo, // 微信、支付宝订单数据
success: function (res) {
console.log('success:' + JSON.stringify(res))
console.log('缴费成功')
if(provider === 'alipay') {
console.log('rawdata:' + res.rawdata)

                    let rawData = JSON.parse(res.rawdata) // 取对象中的rawdata  

                    let resultStr = rawData.result // 取出result字符串  

                    let resultList = resultStr.split(';') // 分号分割,取第0个  

                    let finalRes = resultList[0].substring(0, resultList[0].length - 1) // 将取出来的第0个字符串的最后一位花括号去掉  

                    let finalObject = JSON.parse(finalRes) // 正常转义  

                    let trade_no = finalObject.alipay_trade_app_pay_response.trade_no // 取出订单号  

                    console.log(trade_no)  
                } else if(provider === 'wxpay') {  
                    // 微信支付申请还没通过,出了问题,估计也和支付宝一样  
                }  
            },  
            fail: function (err) {  
                console.log('fail:' + JSON.stringify(err))  
                console.log('缴费失败')  
            }  
        })  
    }
继续阅读 »

如题,在用 uniapp做APP的时候,需要用到支付,在用uni.requestPayment的时候,一切都很顺利,成功后,后端说要给他支付宝返回的订单号(trade_no),本以为正常可以拿到,结果,JSON.stringify把结果打印出来之后,放进json.cn里面根本没法正常转义,一层一层刨开发现对象里面多了一句话,如图。红框框起来的都是多余的,包括花括号,去掉就可以正常字符串转对象。真的拉胯,字符串太长了,不想看,一直以为返回结果没问题,弄了半天~~

希望官方看到后能处理一下!!!

附解决方案代码:
pullUpPay(provider, orderInfo) {
let that = this
uni.requestPayment({
provider: provider,
orderInfo: orderInfo, // 微信、支付宝订单数据
success: function (res) {
console.log('success:' + JSON.stringify(res))
console.log('缴费成功')
if(provider === 'alipay') {
console.log('rawdata:' + res.rawdata)

                    let rawData = JSON.parse(res.rawdata) // 取对象中的rawdata  

                    let resultStr = rawData.result // 取出result字符串  

                    let resultList = resultStr.split(';') // 分号分割,取第0个  

                    let finalRes = resultList[0].substring(0, resultList[0].length - 1) // 将取出来的第0个字符串的最后一位花括号去掉  

                    let finalObject = JSON.parse(finalRes) // 正常转义  

                    let trade_no = finalObject.alipay_trade_app_pay_response.trade_no // 取出订单号  

                    console.log(trade_no)  
                } else if(provider === 'wxpay') {  
                    // 微信支付申请还没通过,出了问题,估计也和支付宝一样  
                }  
            },  
            fail: function (err) {  
                console.log('fail:' + JSON.stringify(err))  
                console.log('缴费失败')  
            }  
        })  
    }
收起阅读 »

DCloud官方会优先处理哪些帖子?为什么我发的帖子总没人理?社群的规则是什么样的?

高效报Bug的姿势 社区bug处理优先级说明

DCloud旗下软件产品有900多万开发者;为了服务到更多的开发者,会把时间集中在更加精准的咨询上。

有些开发者在社区发帖,报bug后遇到没人理会的情况。
主要原因如下:
1.遇到较为直接的问题,应当先运行项目模板hello uni-app示例,看看是否也存在bug。如果不存在说明是你的其他代码逻辑或项目配置影响,先排查具体原因再发帖。如果一样存在,这极有可能是你的设备兼容问题。此时您只要通过报bug模板,说明清楚你的设备信息和bug描述我们就能快速定位你的问题原因。
2.发帖类型错误,不是【提交Bug】类型,从而提交的内容缺少了:设备和开发环境信息导致bug无法复现。同时还缺少了bug类型,导致未能将问题反馈到对应的组,更加高效专业地分析处理。
3.必要的情况下,没有提供能复现bug的demo。或者demo不完整无法直接运行代码的片段。
4.提供的示例,有过多与bug非相关复杂的业务逻辑代码。应当将该代码在一个空项目内复现后提交,避免无相关的逻辑导致冲突而去怀疑技术本身。
5.难以描述的复现过程。建议用手机录屏功能录制一个直观的视频压缩后提交。

社群规则

积分奖罚机制: 提交一个【报Bug】扣20分,但管理员确认Bug后会增加50分,即成功报一个Bug【奖励30分】,误报bug浪费技术资源【罚20分】
积分的作用 : 分数高的用户享有优先的bug处理权重。换句话说我们会去惩罚经常不经自己调试误报bug,浪费技术资源的开发者。同时鼓励开发者积极准确的报bug。并有计划为高分用户创建vip群,近距离高频对接问题和倾听大家对生态的发展方向建议。

综上所述:bug处理优先级 = (项目类型/平台环境/手机系统/问题描述...)等信息是否完整+是否有示例代码+是否有复现视频+用户等级

科学要的是数据而不是情绪,为了高效地社群服务。快速地定位你的问题。为了可以服务更多的开发者。请亲们仔细阅读本文。

继续阅读 »

DCloud旗下软件产品有900多万开发者;为了服务到更多的开发者,会把时间集中在更加精准的咨询上。

有些开发者在社区发帖,报bug后遇到没人理会的情况。
主要原因如下:
1.遇到较为直接的问题,应当先运行项目模板hello uni-app示例,看看是否也存在bug。如果不存在说明是你的其他代码逻辑或项目配置影响,先排查具体原因再发帖。如果一样存在,这极有可能是你的设备兼容问题。此时您只要通过报bug模板,说明清楚你的设备信息和bug描述我们就能快速定位你的问题原因。
2.发帖类型错误,不是【提交Bug】类型,从而提交的内容缺少了:设备和开发环境信息导致bug无法复现。同时还缺少了bug类型,导致未能将问题反馈到对应的组,更加高效专业地分析处理。
3.必要的情况下,没有提供能复现bug的demo。或者demo不完整无法直接运行代码的片段。
4.提供的示例,有过多与bug非相关复杂的业务逻辑代码。应当将该代码在一个空项目内复现后提交,避免无相关的逻辑导致冲突而去怀疑技术本身。
5.难以描述的复现过程。建议用手机录屏功能录制一个直观的视频压缩后提交。

社群规则

积分奖罚机制: 提交一个【报Bug】扣20分,但管理员确认Bug后会增加50分,即成功报一个Bug【奖励30分】,误报bug浪费技术资源【罚20分】
积分的作用 : 分数高的用户享有优先的bug处理权重。换句话说我们会去惩罚经常不经自己调试误报bug,浪费技术资源的开发者。同时鼓励开发者积极准确的报bug。并有计划为高分用户创建vip群,近距离高频对接问题和倾听大家对生态的发展方向建议。

综上所述:bug处理优先级 = (项目类型/平台环境/手机系统/问题描述...)等信息是否完整+是否有示例代码+是否有复现视频+用户等级

科学要的是数据而不是情绪,为了高效地社群服务。快速地定位你的问题。为了可以服务更多的开发者。请亲们仔细阅读本文。

收起阅读 »

uniapp 体积优化秘技

体积优化

uniapp 体积优化秘技

这个方法很简单很有效,只有一句话「不要在 main.js 中加任何一行代码」

下面是我的一个示例

示例

之前这个 main.ts 中还有很多其他杂七杂八的东西,预览的时候体积是 2321KB。都没有办法预览

全部移动到其他地方之后体积降到了 2138KB 虽然还是没有办法预览但体积确实减小了。

编译之后的体积也会有大幅缩小。

原理

uni-app 会将 main.js 中的代码 copy 一份到所有的 生成后的 js 文件中,这是没有必要的,我们将这些代码移动到其他文件然后被打包到 vendor.js 就可以避免这个问题。

即便你 main.js 中之前只有 30 行其他代码,但使用这个方法之后也会得到可观的体积优化。

这个方法我在两个项目中使用到了,即使编译后体积也有 100KB 以上的优化,当然这个优化的大小取决于你 main.js 中的代码数。如果你的项目中 main.js 中有很多代码的话这个方法值得一试!

by 崮生 from 崮生 • 一些随笔
本文欢迎分享与聚合,全文转载未经授权( 联系我)不许可 。

继续阅读 »

uniapp 体积优化秘技

这个方法很简单很有效,只有一句话「不要在 main.js 中加任何一行代码」

下面是我的一个示例

示例

之前这个 main.ts 中还有很多其他杂七杂八的东西,预览的时候体积是 2321KB。都没有办法预览

全部移动到其他地方之后体积降到了 2138KB 虽然还是没有办法预览但体积确实减小了。

编译之后的体积也会有大幅缩小。

原理

uni-app 会将 main.js 中的代码 copy 一份到所有的 生成后的 js 文件中,这是没有必要的,我们将这些代码移动到其他文件然后被打包到 vendor.js 就可以避免这个问题。

即便你 main.js 中之前只有 30 行其他代码,但使用这个方法之后也会得到可观的体积优化。

这个方法我在两个项目中使用到了,即使编译后体积也有 100KB 以上的优化,当然这个优化的大小取决于你 main.js 中的代码数。如果你的项目中 main.js 中有很多代码的话这个方法值得一试!

by 崮生 from 崮生 • 一些随笔
本文欢迎分享与聚合,全文转载未经授权( 联系我)不许可 。

收起阅读 »

uniapp运行到微信开发者工具出现 [ WXSS 文件编译错误] 的解决办法

问题描述:

uniapp运行到微信开发者工具,在控制台出现:[ WXSS 文件编译错误]提示,如图:

控制台点击main.wxss文件发现在uniapp中定义的uni.scss变量保持原样,没有经过编译,如图:

问题出现的原因:

经过查找发现,是由于我在app.vue中手动引入了uni.scss,并未在style标签上声明scss模式,所以uni.scss内定义的css变量就未经编译,被当做普通css进行引入,编译到小程序后,wxss不识别所以报错,如图:

解决办法:

1.不要在app.vue或其它文件内手动引用uni.scss,默认无需引用,就可以直接在其它文件的<style lang="scss">内调用里面的css变量
2.如果手动引用了,记得在style标签上声明为scss模式,如:

<style lang="scss">  
      /*但凡用到scss方式设置css的地方都要在标签上显示声明*/  
      ...  
</style>

uni.scss官方说明文档:https://uniapp.dcloud.io/collocation/uni-scss?id=collocation

另补充:奇怪的是编译到APP平台不报错,按道理官方应该也需要处理一下遇到这种引用scss,未声明style模式的时候,给一个报错提示

继续阅读 »

问题描述:

uniapp运行到微信开发者工具,在控制台出现:[ WXSS 文件编译错误]提示,如图:

控制台点击main.wxss文件发现在uniapp中定义的uni.scss变量保持原样,没有经过编译,如图:

问题出现的原因:

经过查找发现,是由于我在app.vue中手动引入了uni.scss,并未在style标签上声明scss模式,所以uni.scss内定义的css变量就未经编译,被当做普通css进行引入,编译到小程序后,wxss不识别所以报错,如图:

解决办法:

1.不要在app.vue或其它文件内手动引用uni.scss,默认无需引用,就可以直接在其它文件的<style lang="scss">内调用里面的css变量
2.如果手动引用了,记得在style标签上声明为scss模式,如:

<style lang="scss">  
      /*但凡用到scss方式设置css的地方都要在标签上显示声明*/  
      ...  
</style>

uni.scss官方说明文档:https://uniapp.dcloud.io/collocation/uni-scss?id=collocation

另补充:奇怪的是编译到APP平台不报错,按道理官方应该也需要处理一下遇到这种引用scss,未声明style模式的时候,给一个报错提示

收起阅读 »

关于mui 框架的上拉加载失效的问题

 在使用上拉加载,下拉刷新的组件的时候,我一直都是使用mui('#').pullRefresh().endPulldownToRefresh()和 mui('#lifecircle_refresh').pullRefresh().endPullupToRefresh();来进行停止刷新和加载。 但是在今天的项目中,我在第一次进入APP的时候,可以下拉刷新,然后上拉加载,等到把数据加载完了之后,尾部提示"没有更多数据了“,之后我在进行下拉刷新,出来一组数据,之后,再上拉加载,尾部直接显示,”没有更多数据了"  就是说,上拉加载失效了,因为根本没有加载函数。后来查了资料和官网,得知,在第一次把数据加载完之后,框架自动设置禁止上拉加载。需要用mui('#lifecircle_refresh').pullRefresh().refresh(true);,来启动上拉加载。就可以了  

继续阅读 »
 在使用上拉加载,下拉刷新的组件的时候,我一直都是使用mui('#').pullRefresh().endPulldownToRefresh()和 mui('#lifecircle_refresh').pullRefresh().endPullupToRefresh();来进行停止刷新和加载。 但是在今天的项目中,我在第一次进入APP的时候,可以下拉刷新,然后上拉加载,等到把数据加载完了之后,尾部提示"没有更多数据了“,之后我在进行下拉刷新,出来一组数据,之后,再上拉加载,尾部直接显示,”没有更多数据了"  就是说,上拉加载失效了,因为根本没有加载函数。后来查了资料和官网,得知,在第一次把数据加载完之后,框架自动设置禁止上拉加载。需要用mui('#lifecircle_refresh').pullRefresh().refresh(true);,来启动上拉加载。就可以了  

收起阅读 »

承接H5、小程序、、PC端网站、后台系统等外包

pc 小程序 公众号 h5 外包

承接H5、小程序、PC端网站、后台系统等外包,主要技术栈为vue、uni-app,有意请加微信:1819080149(前端,有单子的服务端可找我合作,或者完全丢给我,我这也有一个小团队,非诚勿扰、谢谢)

承接H5、小程序、PC端网站、后台系统等外包,主要技术栈为vue、uni-app,有意请加微信:1819080149(前端,有单子的服务端可找我合作,或者完全丢给我,我这也有一个小团队,非诚勿扰、谢谢)

关于input在 PDA环境中扫描,无法清空input的情况

广播 input 扫描

开发PDA实现扫描录入,由于uniapp不支持原生input的keydown事件,所以无法判断回车键。

这边使用的是 @confirm事件,实现回车提交,但是测试中遇到了问题,每扫描几次就会间隔性出现 input未被清空的情况,就会导致和下次扫描数据一起提交。实际测试发现如果使用软键盘提交回车没有出现这种情况,怀疑可能扫描录入的数据填充的比较快。因为这个问题研究了很多天,并在社区搜索相关解决方案,目前碰到的最妥善的方法可能就是监听广播,直接原生获取扫描数据。
但是根据大家的描述来看,广播模式似乎只支持 android 8.0 以上的设备,而我测试的PDA版本为5.1,在设置中也确实没有找到相关设置,如果使用该方式可能需要更换设备,所以广播应为最后的处理手段。实际上采集录入的最佳方式还是直接扫描到录入框,但是受到框架的一定限制让我感到十分无奈。

不过就在刚才我突然灵机一动,既然input无法更新视图,清空录入框中的数据,那我为什么不使用 v-if 将他们重新渲染呢?最终经过测试,完美实现预期效。

     <view v-if="bool">  
        <input class="input" @confirm="confirm1" v-model="value" key="1" auto-focus="autofocus" />  
    </view>  
    <view v-else>  
        <input class="input" @confirm="confirm1" v-model="value" key="2" auto-focus="autofocus" />  
    </view>  

当然目前只是通过的测试,无法保证在后面实际应用中会导致什么异常,先将方法分享出来,如果有异常我再继续在帖子下面回复,如果大家有更好的方式也请分享给我一下,十分感谢!

附件我上传了测试的视频

继续阅读 »

开发PDA实现扫描录入,由于uniapp不支持原生input的keydown事件,所以无法判断回车键。

这边使用的是 @confirm事件,实现回车提交,但是测试中遇到了问题,每扫描几次就会间隔性出现 input未被清空的情况,就会导致和下次扫描数据一起提交。实际测试发现如果使用软键盘提交回车没有出现这种情况,怀疑可能扫描录入的数据填充的比较快。因为这个问题研究了很多天,并在社区搜索相关解决方案,目前碰到的最妥善的方法可能就是监听广播,直接原生获取扫描数据。
但是根据大家的描述来看,广播模式似乎只支持 android 8.0 以上的设备,而我测试的PDA版本为5.1,在设置中也确实没有找到相关设置,如果使用该方式可能需要更换设备,所以广播应为最后的处理手段。实际上采集录入的最佳方式还是直接扫描到录入框,但是受到框架的一定限制让我感到十分无奈。

不过就在刚才我突然灵机一动,既然input无法更新视图,清空录入框中的数据,那我为什么不使用 v-if 将他们重新渲染呢?最终经过测试,完美实现预期效。

     <view v-if="bool">  
        <input class="input" @confirm="confirm1" v-model="value" key="1" auto-focus="autofocus" />  
    </view>  
    <view v-else>  
        <input class="input" @confirm="confirm1" v-model="value" key="2" auto-focus="autofocus" />  
    </view>  

当然目前只是通过的测试,无法保证在后面实际应用中会导致什么异常,先将方法分享出来,如果有异常我再继续在帖子下面回复,如果大家有更好的方式也请分享给我一下,十分感谢!

附件我上传了测试的视频

收起阅读 »

雨滴科技蓝牙打印Demo

为方便用户使用H5开发便携式蓝牙打印机的安卓端运用,我司提供h5 demo,以便大家共享。

为方便用户使用H5开发便携式蓝牙打印机的安卓端运用,我司提供h5 demo,以便大家共享。

雨滴科技PDA条码H5 Demo

条码

为方便使用H5开发的用户能够快速的开发安卓app,并且调用条码扫描服务,在此写了一个H5的demo,以便大家共享。

为方便使用H5开发的用户能够快速的开发安卓app,并且调用条码扫描服务,在此写了一个H5的demo,以便大家共享。