HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

记rules 数值大小校验失效 minimum maximum

uni_ui uniapp

要加数据格式
"format":"number",

不能同时使用字符串类型的校验如
// 对name字段进行长度验证
{
minLength: 1,
maxLength: 10,
errorMessage: '{label}长度在 {minLength} 到 {maxLength} 个字符',
} ,

继续阅读 »

要加数据格式
"format":"number",

不能同时使用字符串类型的校验如
// 对name字段进行长度验证
{
minLength: 1,
maxLength: 10,
errorMessage: '{label}长度在 {minLength} 到 {maxLength} 个字符',
} ,

收起阅读 »

应用内打开Safair、app嵌入Safair

应用内打开Safair、app嵌入Safair:https://ext.dcloud.net.cn/plugin?id=8512

应用内打开Safair、app嵌入Safair:https://ext.dcloud.net.cn/plugin?id=8512

uniapp个人接单

外包接单

个人接uni-app外包项目开发。
接uni-app技术咨询,可远程调试。
联系QQ:1615313820
微信:w1615313820
产品案例:
个人从需求、底层、界面、数据库、开发、上线和运营的全套产品:
1、微信小程序:移宝网、惠团学、黔夫山货、一把伞,404男士理发等
2、公众号:愉悦到家
3、AppStore里搜索 漂流瓶-人匿名聊天交友;

继续阅读 »

个人接uni-app外包项目开发。
接uni-app技术咨询,可远程调试。
联系QQ:1615313820
微信:w1615313820
产品案例:
个人从需求、底层、界面、数据库、开发、上线和运营的全套产品:
1、微信小程序:移宝网、惠团学、黔夫山货、一把伞,404男士理发等
2、公众号:愉悦到家
3、AppStore里搜索 漂流瓶-人匿名聊天交友;

收起阅读 »

免费解决uniapp相关问题

在线解决uniapp相关问题(框架bug除外)

前后端问题都可以,在下面提出你的问题,我看到了会回复。(仅限工作日,9:30-18:30)

在线解决uniapp相关问题(框架bug除外)

前后端问题都可以,在下面提出你的问题,我看到了会回复。(仅限工作日,9:30-18:30)

Hbuildx创建的项目最好能够分组

项目管理器

Hbuildx创建项目过多时查找项目都很麻烦,希望左侧的目录列表能够有分组的功能,这样查找项目就会更方便!

Hbuildx创建项目过多时查找项目都很麻烦,希望左侧的目录列表能够有分组的功能,这样查找项目就会更方便!

uni-pay和uni-id app微信支付 微信登录,签名验证未通过,闭坑,app微信支付无法弹出微信支付页面,

报错:{"code":-100,"message":"[payment微信:-1]General errors"}
.
闭坑说明:
同时使用uni官方的uni-id微信登录和uni-pay,uni官方更新说明cloudfunctions/common/uni-config-center/uni-id/config.json下
"preferedAppPlatform": "app-plus"和"app-plus": {},手动改成"preferedAppPlatform": "app"和"app": {},
微信登录可以正常使用了,但是微信支付app端云函数unipayIns.getOrderInfo()返回前端数据是微信小程序的数据,而不是app端的

unipayIns.getOrderInfo()微信小程序微信支付:云函数返回前端字段
{
"appId": "",
"nonceStr": "",
"package": "",
"timeStamp": "",
"signType": "",
"paySign": "",
"timestamp": ""
}
unipayIns.getOrderInfo()app微信支付:云函数返回前端字段

{
"appid": "",
"noncestr": "",
"package": "",
"partnerid": "",
"prepayid": "",
"timestamp": "",
"sign": ""
}

解决办法:云函数unipay.initWeixin()入参加入 clientType:'app-plus',这个字段

const unipayIns = unipay.initWeixin({
appId: 'wx111111111111111',
mchId: '1222222226',
key: '222222222222222223',
clientType:'app-plus',
})

问题就解决了,谁也想不到这个两个会有关联,

继续阅读 »

报错:{"code":-100,"message":"[payment微信:-1]General errors"}
.
闭坑说明:
同时使用uni官方的uni-id微信登录和uni-pay,uni官方更新说明cloudfunctions/common/uni-config-center/uni-id/config.json下
"preferedAppPlatform": "app-plus"和"app-plus": {},手动改成"preferedAppPlatform": "app"和"app": {},
微信登录可以正常使用了,但是微信支付app端云函数unipayIns.getOrderInfo()返回前端数据是微信小程序的数据,而不是app端的

unipayIns.getOrderInfo()微信小程序微信支付:云函数返回前端字段
{
"appId": "",
"nonceStr": "",
"package": "",
"timeStamp": "",
"signType": "",
"paySign": "",
"timestamp": ""
}
unipayIns.getOrderInfo()app微信支付:云函数返回前端字段

{
"appid": "",
"noncestr": "",
"package": "",
"partnerid": "",
"prepayid": "",
"timestamp": "",
"sign": ""
}

解决办法:云函数unipay.initWeixin()入参加入 clientType:'app-plus',这个字段

const unipayIns = unipay.initWeixin({
appId: 'wx111111111111111',
mchId: '1222222226',
key: '222222222222222223',
clientType:'app-plus',
})

问题就解决了,谁也想不到这个两个会有关联,

收起阅读 »

解决热更新时某些手机更新完成后重启出现undefined的问题

热更新

原因是手机webview缓存导致的,咱们只需要每次修改引入文件的名字,让他们不一致就行
最近一直是手工修改,耗费时间且容易出错,为了避免手工修改出现错误,我做了个脚本

1.全局安装修复工具

npm install uni-wgt-fix -g

2.在打包好的wgt文件夹所在目录执行 wgt fix 命令

wgt fix

3.会自动生成_fix.wgt的文件,发布时发布_fix.wgt文件就行,如图

有问题可以加群: 870279915

修改的文件名如下共4个,如图:


修改的文件内容如下图:

继续阅读 »

原因是手机webview缓存导致的,咱们只需要每次修改引入文件的名字,让他们不一致就行
最近一直是手工修改,耗费时间且容易出错,为了避免手工修改出现错误,我做了个脚本

1.全局安装修复工具

npm install uni-wgt-fix -g

2.在打包好的wgt文件夹所在目录执行 wgt fix 命令

wgt fix

3.会自动生成_fix.wgt的文件,发布时发布_fix.wgt文件就行,如图

有问题可以加群: 870279915

修改的文件名如下共4个,如图:


修改的文件内容如下图:

收起阅读 »

uniapp 第一次安装,获取的plus.push.getClientInfo().clientid为null的解决方案

App.vue

<script>  
    export default {  
        onLaunch: function() {  
            console.log('App Launch');  

            // 第一次安装,获取的设备信息clientid为null  
            // 用于解决plus.push.getClientInfo同步获取可能返回数据为空的问题  
            // 要延迟一点时间获取,具体延迟多长不确定。使用以下代码解决  
            var t1 = setInterval(() => {    
                var info = plus.push.getClientInfo();  
                var clientid = info.clientid; // 注意:clientid为空时,返回的是字符串"null"  
                if(clientid && clientid != "null") {  
                    console.log(clientid) // 客户端标识  
                    clearInterval(t1);  
                }  
            },50);  

        }  
    };  
</script>
继续阅读 »

App.vue

<script>  
    export default {  
        onLaunch: function() {  
            console.log('App Launch');  

            // 第一次安装,获取的设备信息clientid为null  
            // 用于解决plus.push.getClientInfo同步获取可能返回数据为空的问题  
            // 要延迟一点时间获取,具体延迟多长不确定。使用以下代码解决  
            var t1 = setInterval(() => {    
                var info = plus.push.getClientInfo();  
                var clientid = info.clientid; // 注意:clientid为空时,返回的是字符串"null"  
                if(clientid && clientid != "null") {  
                    console.log(clientid) // 客户端标识  
                    clearInterval(t1);  
                }  
            },50);  

        }  
    };  
</script>
收起阅读 »

【实战】uni-app阿里直播实战项目开发

直播 uniapp 教程

基于Vue + 阿里直播实战开发直播APP,涉及直播一系列完整的流程,从主播开播到阿里直播自动生成推流地址和播(拉)流地址,用户在APP上点击进行观看直播。

课程地址:
https://study.163.com/course/introduction.htm?share=2&shareId=400000000301017&courseId=1212826801&_trace_c_pk2=a05433ad56494c2f8adb8a4e5c671dc4

或:
https://www.studyfox.cn/487.html

课程目录:

第1讲_项目介绍

第2讲_uniapp前端项目搭建

第3讲_引入全局样式和图标库

第4讲_引入全局样式和图标库

第5讲_底部导航设计

第6讲_底部导航设计

第7讲_底部导航切换

第8讲_创建直播列表模拟数据

第9讲_首页直播列表显示

第10讲_阿里云视频直播设置

第11讲_阿里云视频直播推流播流地址说明

第12讲_管理后台搭建

第13讲_vscode远程连接服务器

第14讲_阿里云视频直播SDK在线安装

第15讲_阿里云视频直播调用API设计

第16讲_阿里云视频直播调用API设计

第17讲_阿里云直播创建签名方法

第18讲_阿里云直播创建推流地址

第19讲_阿里云直播创建拉流地址

第20讲_创建直播数据表

第21讲_通过API接口将推流拉流地址写入数据库

第22讲_管理后台直播列表显示

第23讲_管理后台直播列表显示

第24讲_管理后台直播列表显示

第25讲_uniapp前端公共方法封装

第26讲_uniapp前端公共方法封装

第27讲_API接口获取直播列表

第28讲_uniapp首页获取直播列表

第29讲_uniapp直播功能

第30讲_uniapp直播功能

第31讲_uniapp直播调试

第32讲_uniapp直播页面添加顶部导航

第33讲_uniapp直播页面顶部导航完善

第34讲_uniapp直播真机调试

第35讲_uniapp直播真机调试

第36讲_uniapp观看直播页面设计

第37讲_uniapp观看直播页面设计

第38讲_获取直播在线人数

第39讲_定时检测直播状态

第40讲_uniapp首页直播状态显示

继续阅读 »

基于Vue + 阿里直播实战开发直播APP,涉及直播一系列完整的流程,从主播开播到阿里直播自动生成推流地址和播(拉)流地址,用户在APP上点击进行观看直播。

课程地址:
https://study.163.com/course/introduction.htm?share=2&shareId=400000000301017&courseId=1212826801&_trace_c_pk2=a05433ad56494c2f8adb8a4e5c671dc4

或:
https://www.studyfox.cn/487.html

课程目录:

第1讲_项目介绍

第2讲_uniapp前端项目搭建

第3讲_引入全局样式和图标库

第4讲_引入全局样式和图标库

第5讲_底部导航设计

第6讲_底部导航设计

第7讲_底部导航切换

第8讲_创建直播列表模拟数据

第9讲_首页直播列表显示

第10讲_阿里云视频直播设置

第11讲_阿里云视频直播推流播流地址说明

第12讲_管理后台搭建

第13讲_vscode远程连接服务器

第14讲_阿里云视频直播SDK在线安装

第15讲_阿里云视频直播调用API设计

第16讲_阿里云视频直播调用API设计

第17讲_阿里云直播创建签名方法

第18讲_阿里云直播创建推流地址

第19讲_阿里云直播创建拉流地址

第20讲_创建直播数据表

第21讲_通过API接口将推流拉流地址写入数据库

第22讲_管理后台直播列表显示

第23讲_管理后台直播列表显示

第24讲_管理后台直播列表显示

第25讲_uniapp前端公共方法封装

第26讲_uniapp前端公共方法封装

第27讲_API接口获取直播列表

第28讲_uniapp首页获取直播列表

第29讲_uniapp直播功能

第30讲_uniapp直播功能

第31讲_uniapp直播调试

第32讲_uniapp直播页面添加顶部导航

第33讲_uniapp直播页面顶部导航完善

第34讲_uniapp直播真机调试

第35讲_uniapp直播真机调试

第36讲_uniapp观看直播页面设计

第37讲_uniapp观看直播页面设计

第38讲_获取直播在线人数

第39讲_定时检测直播状态

第40讲_uniapp首页直播状态显示

收起阅读 »

[踩坑经验] uni.uploadFile上传文件到OSS

上传文件

name 参数必须填'file'

name 参数必须填'file'

下拉刷新新人踩坑经验

下拉刷新

发帖背景:项目需要在用户登录后如果出现数据未加载的情况允许用户下拉刷新,重新获取数据。

官方文档对下拉刷新的说明:https://uniapp.dcloud.io/api/ui/pulldown.html#onpulldownrefresh

踩坑1:(个人问题)

可以看到用户需要开启下拉刷新,但是由于我需要刷新的是tabbar页面,所以我非常愚钝的设置在了(均为pages.json文件内)tabBar列表而不是pages(忘记了)从而导致无法开启下拉刷新

踩坑2:Error: [xxx]: :require(...).main is not a function

这种情况大家参加这篇文章:https://bobbyhadz.com/blog/javascript-typeerror-require-is-not-a-function

我会触发这个报错的原因是我在vue页面使用下拉刷新调用了云端函数重新拉取数据,也就是在云函数引用 const path = require('path');时结尾没有加 ;分号,补上重新运行就好了

最后附上完整函数,写在 script 即可

async onPullDownRefresh () {
console.log('触发下拉刷新了');
await userService.afterLogin(); //这里是我用于登录后拉取数据的函数,没有异步函数的话不需要写 async 和 await
setTimeout(()=>{
uni.stopPullDownRefresh(); //停止刷新
},2000)
}

继续阅读 »

发帖背景:项目需要在用户登录后如果出现数据未加载的情况允许用户下拉刷新,重新获取数据。

官方文档对下拉刷新的说明:https://uniapp.dcloud.io/api/ui/pulldown.html#onpulldownrefresh

踩坑1:(个人问题)

可以看到用户需要开启下拉刷新,但是由于我需要刷新的是tabbar页面,所以我非常愚钝的设置在了(均为pages.json文件内)tabBar列表而不是pages(忘记了)从而导致无法开启下拉刷新

踩坑2:Error: [xxx]: :require(...).main is not a function

这种情况大家参加这篇文章:https://bobbyhadz.com/blog/javascript-typeerror-require-is-not-a-function

我会触发这个报错的原因是我在vue页面使用下拉刷新调用了云端函数重新拉取数据,也就是在云函数引用 const path = require('path');时结尾没有加 ;分号,补上重新运行就好了

最后附上完整函数,写在 script 即可

async onPullDownRefresh () {
console.log('触发下拉刷新了');
await userService.afterLogin(); //这里是我用于登录后拉取数据的函数,没有异步函数的话不需要写 async 和 await
setTimeout(()=>{
uni.stopPullDownRefresh(); //停止刷新
},2000)
}

收起阅读 »