HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

已备案,wap2app打包时提示域名未备案

已备案,web2app打包时提示域名未备案

已备案,web2app打包时提示域名未备案

mqtt连接阿里云物联网平台H5可以正常,app显示一直重连

参考插件市场的mqtt-demo,连接阿里云联网平台 H5可以正常连接,app提示一直重连,经过反复一天的折腾,晚上最终连接成功。现在分离出来供大家参考。

1.连接所需要的网址,密码,clientID之类的在阿里物联网平台可获得。
2.参考插件市场的mqtt-demo插件下的评论得知,需要mqtt.js的版本是3.0.0 所以需要npm i mqtt@^3.0.0
3.import mqtt from "mqtt/dist/mqtt.js"; // 一定要dist下的mqtt.js
4.协议和端口
// #ifdef H5
host = "ws://xxxxxxxxx:443";
// #endif
// #ifdef MP-WEIXIN||APP-PLUS
host = "wxs://xxxxxxxxx:80";
// #endif

继续阅读 »

参考插件市场的mqtt-demo,连接阿里云联网平台 H5可以正常连接,app提示一直重连,经过反复一天的折腾,晚上最终连接成功。现在分离出来供大家参考。

1.连接所需要的网址,密码,clientID之类的在阿里物联网平台可获得。
2.参考插件市场的mqtt-demo插件下的评论得知,需要mqtt.js的版本是3.0.0 所以需要npm i mqtt@^3.0.0
3.import mqtt from "mqtt/dist/mqtt.js"; // 一定要dist下的mqtt.js
4.协议和端口
// #ifdef H5
host = "ws://xxxxxxxxx:443";
// #endif
// #ifdef MP-WEIXIN||APP-PLUS
host = "wxs://xxxxxxxxx:80";
// #endif

收起阅读 »

mui.confirm 点击事件执行两次

mui点击事件执行两次的解决办法

  1. 检查事件是否绑定了两次
  2. 检查一下页面是不是引用了两次mui.js

mui点击事件执行两次的解决办法

  1. 检查事件是否绑定了两次
  2. 检查一下页面是不是引用了两次mui.js

找到一个动态修改uniapp程序页面缩放的办法,分享给有需要的人

uniapp

uniapp配置rpxCalc并不能动态指定1个rpx转换成多少px。
但是系统本身是将rpx转换为rem来处理的,问题的关键在于修改rootFontSize,也就是html元素的fontSize
那么可以在所有page(怨念,每个page都用一个新的webview)的onShow方法里面inject一段js,用于修改html的fs

function fixRPX(){  
  var VH = window.innerHeight;  
  var fs = Number((VH/70).toFixed(2));//此处是按980高度对应14px来等比例计算的,可自行摸索合适的数值  
  document.querySelector('html').style.fontSize=fs+'px';  
}
onShow(){  
  var page=getCurrentPages().slice(-1)[0];  
  var webView = page.$getAppWebview();  
  webView.evalJS( `(${fixRPX.toString()})();` );  
}

这样就可以在每个页面显示的瞬间修改rootFontSize
也可以把所有页面放在一个layout母版页内,这样只需要改模板页的mounted
本人已实测有效

继续阅读 »

uniapp配置rpxCalc并不能动态指定1个rpx转换成多少px。
但是系统本身是将rpx转换为rem来处理的,问题的关键在于修改rootFontSize,也就是html元素的fontSize
那么可以在所有page(怨念,每个page都用一个新的webview)的onShow方法里面inject一段js,用于修改html的fs

function fixRPX(){  
  var VH = window.innerHeight;  
  var fs = Number((VH/70).toFixed(2));//此处是按980高度对应14px来等比例计算的,可自行摸索合适的数值  
  document.querySelector('html').style.fontSize=fs+'px';  
}
onShow(){  
  var page=getCurrentPages().slice(-1)[0];  
  var webView = page.$getAppWebview();  
  webView.evalJS( `(${fixRPX.toString()})();` );  
}

这样就可以在每个页面显示的瞬间修改rootFontSize
也可以把所有页面放在一个layout母版页内,这样只需要改模板页的mounted
本人已实测有效

收起阅读 »

uni-admin 升级教程 与 需要注意的细节

前缀操作

先确保本地代码都提交,这样在升级合并时,只需关注更新的文件。

升级

  1. 使用 HBuilderX 打开项目
  2. 找到 package.json 文件
  3. 右键,选择「从插件市场更新」
  4. 解决冲突(记得每个文件都逐一确认一下,确保自己修改的内容没有被覆盖)

注意

升级之后,admin 无法登录?(此账号未在该应用注册)

升级之后,manifest.json 的数据也会更新,会导致该文件里面的 appid 字段被清空,此时需要再改回去。

然后重启应用即可。

配合 uni-starter 使用

如果配合 uni-starter 使用,你可能会将 2 个项目的 uni-Cloud 进行关联合并,在升级后,需要确认一下 uni_modules 中关于 uniCloud 的函数变动,确保此处的改动,不影响 uni-starter 逻辑,

继续阅读 »

前缀操作

先确保本地代码都提交,这样在升级合并时,只需关注更新的文件。

升级

  1. 使用 HBuilderX 打开项目
  2. 找到 package.json 文件
  3. 右键,选择「从插件市场更新」
  4. 解决冲突(记得每个文件都逐一确认一下,确保自己修改的内容没有被覆盖)

注意

升级之后,admin 无法登录?(此账号未在该应用注册)

升级之后,manifest.json 的数据也会更新,会导致该文件里面的 appid 字段被清空,此时需要再改回去。

然后重启应用即可。

配合 uni-starter 使用

如果配合 uni-starter 使用,你可能会将 2 个项目的 uni-Cloud 进行关联合并,在升级后,需要确认一下 uni_modules 中关于 uniCloud 的函数变动,确保此处的改动,不影响 uni-starter 逻辑,

收起阅读 »

全栈程序员在线接单,沉淀多年经验,为您解决疑难问题!

外包 外包接单

8年全栈开发经验,精通Java、PHP、Go、Vue、React、UniApp等技术栈,熟悉前后端分离开发、微服务架构、容器化部署等技术。
拥有丰富的开发经验,包括电商平台、在线教育平台、社交媒体平台等。
能够独立完成从项目的分析、设计、开发、测试、部署到维护与优化的全过程,并能够根据客户需求进行定制化开发。
注重代码可维护性、可扩展性、性能优化等方面的工作。
如果您正在寻找一位高效、专业的开发者来完成您的项目,我非常愿意为您提供优质的服务,共同推动项目顺利进行。
如果您对我的技能与工作经验感兴趣,请通过微信联系我,我们可以进一步探讨您的具体项目需求,并且开展合作。
V:TombaughWechat

继续阅读 »

8年全栈开发经验,精通Java、PHP、Go、Vue、React、UniApp等技术栈,熟悉前后端分离开发、微服务架构、容器化部署等技术。
拥有丰富的开发经验,包括电商平台、在线教育平台、社交媒体平台等。
能够独立完成从项目的分析、设计、开发、测试、部署到维护与优化的全过程,并能够根据客户需求进行定制化开发。
注重代码可维护性、可扩展性、性能优化等方面的工作。
如果您正在寻找一位高效、专业的开发者来完成您的项目,我非常愿意为您提供优质的服务,共同推动项目顺利进行。
如果您对我的技能与工作经验感兴趣,请通过微信联系我,我们可以进一步探讨您的具体项目需求,并且开展合作。
V:TombaughWechat

收起阅读 »

3.7.12.20230331-alpha版本搜索功能算是废了

搜索

3.7.12.20230331-alpha版本搜索功能算是废了,原先的搜索功能目标都能够搜索出来,现在搜同一个目标就再也搜不出了,越更新越回去了,搜索个封禁都已经搜不出,先前版本啥事没有


继续阅读 »

3.7.12.20230331-alpha版本搜索功能算是废了,原先的搜索功能目标都能够搜索出来,现在搜同一个目标就再也搜不出了,越更新越回去了,搜索个封禁都已经搜不出,先前版本啥事没有


收起阅读 »

IOS云打包服务还能用吗?

[HBuilder] 13:11:56.075 目前云打包排队人数较多,当前打包任务位于队列第 39位,预计 247 分钟内进入打包状态。
6个小时,39人

然后,过了16分钟,队伍往前挪了2位。。。
[HBuilder] 13:27:11.582 目前云打包排队人数较多,当前打包任务位于队列第 37位,预计 247 分钟内进入打包状态。

这是什么年代的什么样的服务?

继续阅读 »

[HBuilder] 13:11:56.075 目前云打包排队人数较多,当前打包任务位于队列第 39位,预计 247 分钟内进入打包状态。
6个小时,39人

然后,过了16分钟,队伍往前挪了2位。。。
[HBuilder] 13:27:11.582 目前云打包排队人数较多,当前打包任务位于队列第 37位,预计 247 分钟内进入打包状态。

这是什么年代的什么样的服务?

收起阅读 »

几时添加支持其他编程语言,如 c、c++、cmd、Bash/Shell、Go、Python、PHP、Java、JavaScript、TypeScript等各种语言

几时添加支持其他编程语言,如 c、c++、cmd、Bash/Shell、Go、Python、PHP、Java、JavaScript、TypeScript等各种语言

几时添加支持其他编程语言,如 c、c++、cmd、Bash/Shell、Go、Python、PHP、Java、JavaScript、TypeScript等各种语言

关于u--input在APP下无法使用后置插槽

问题:
如果使用u--input组件并且使用后置插槽,那么在真机中将会渲染成【undefined】.

过程:
在DCLOUD社区、百度、uview-ui官方QQ频道和QQ群寻找答案均未果,后来仔细查看官方文档中的【input组件】部分发现端倪,于是决定使用【u-input】组件试试,在真机渲染后发现是正常的。

不知道是使用方法不对还是理解没有那么透彻,可能是对【u--input】与【u-input】没有那么上心吧,总之这样是可以正常使用了。如果参照本方法还是无法解决的话,可能是版本不同的原因,也可能是其她的原因。

继续阅读 »

问题:
如果使用u--input组件并且使用后置插槽,那么在真机中将会渲染成【undefined】.

过程:
在DCLOUD社区、百度、uview-ui官方QQ频道和QQ群寻找答案均未果,后来仔细查看官方文档中的【input组件】部分发现端倪,于是决定使用【u-input】组件试试,在真机渲染后发现是正常的。

不知道是使用方法不对还是理解没有那么透彻,可能是对【u--input】与【u-input】没有那么上心吧,总之这样是可以正常使用了。如果参照本方法还是无法解决的话,可能是版本不同的原因,也可能是其她的原因。

收起阅读 »

文件上传 切片分段 APP

上传文件

说明

使用 5+api
目前仅测试了app,测试也不完整,这里只是提供一个方法

利用 5+app 中 file.slice方法切片,再转化成base64上传,而我需要的正好就是base64格式

就当是记录一下

代码如下

/**  
 * 上传文件  
 * @param {Object} url需要绝对路径  
 */  
function Upload(url) {  
    return new Promise(async (resolve, reject) => {  
        let file;  
        try {  
            url = verifyFileUrl(url)  
            file = await getFileManagerSync(url);  
            let size = file.size,  
                chunk = 1048576,  
                current = 0;  
            // 开始切片  
            while (current < size) {  
                let tmp = file.slice(current, Math.min(current   chunk, size));  
                // 切片后返回的也是 file 对象,直接读取内容  
                let base64 = await file_reader_as_data_url(tmp);  
                let r = await UpFile(base64);  
                current  = chunk   1;  
            }  
            resolve('上传成功')  
        } catch (e) {  
            reject(e)  
        } finally {  
            if (file !== undefined) file.close();  
        }  
    })  
}  

/**  
 * 上传到服务器方法  
 * @param {Object} base64  
 */  
function UpFile(base64){  
    // 文件上传  
}  

/**  
 * 文件路径 可能是 file://store/  开头  
 * @param {Object} str 文件路径  
 */  
function verifyFileUrl(str) {  
    if (str.startsWith('file://')) {  
        str = str.substring(7)  
    }  
    return str  
}  

/**  
 * 使用5 app 获取file对象  
 * @param {Object} fileName  
 */  
function getFileManagerSync(fileName) {  
    return new Promise((resolve, reject) => {  
        plus.io.resolveLocalFileSystemURL(fileName, function(fs) {  
            fs.file(function(file) {  
                resolve((file))  
            })  
        }, err => {  
            reject(err)  
        })  
    })  
}  

/**  
 *  读取文件对象的 base64字符串  
 * @param {Object} file 5 app 的 文件对象  
 */  
function file_reader_as_data_url(file){  
    return new Promise((resolve,reject)=>{  
        try{  
            let fileReader =new plus.io.FileReader();  
            fileReader.onloadend = function(evt) {  
                resolve(evt.target.result)  
            };  
            fileReader.readAsDataURL(file,'UTF-8');  
        }catch(e){  
            //TODO handle the exception  
            reject(e)  
        }  
    })  
}
继续阅读 »

说明

使用 5+api
目前仅测试了app,测试也不完整,这里只是提供一个方法

利用 5+app 中 file.slice方法切片,再转化成base64上传,而我需要的正好就是base64格式

就当是记录一下

代码如下

/**  
 * 上传文件  
 * @param {Object} url需要绝对路径  
 */  
function Upload(url) {  
    return new Promise(async (resolve, reject) => {  
        let file;  
        try {  
            url = verifyFileUrl(url)  
            file = await getFileManagerSync(url);  
            let size = file.size,  
                chunk = 1048576,  
                current = 0;  
            // 开始切片  
            while (current < size) {  
                let tmp = file.slice(current, Math.min(current   chunk, size));  
                // 切片后返回的也是 file 对象,直接读取内容  
                let base64 = await file_reader_as_data_url(tmp);  
                let r = await UpFile(base64);  
                current  = chunk   1;  
            }  
            resolve('上传成功')  
        } catch (e) {  
            reject(e)  
        } finally {  
            if (file !== undefined) file.close();  
        }  
    })  
}  

/**  
 * 上传到服务器方法  
 * @param {Object} base64  
 */  
function UpFile(base64){  
    // 文件上传  
}  

/**  
 * 文件路径 可能是 file://store/  开头  
 * @param {Object} str 文件路径  
 */  
function verifyFileUrl(str) {  
    if (str.startsWith('file://')) {  
        str = str.substring(7)  
    }  
    return str  
}  

/**  
 * 使用5 app 获取file对象  
 * @param {Object} fileName  
 */  
function getFileManagerSync(fileName) {  
    return new Promise((resolve, reject) => {  
        plus.io.resolveLocalFileSystemURL(fileName, function(fs) {  
            fs.file(function(file) {  
                resolve((file))  
            })  
        }, err => {  
            reject(err)  
        })  
    })  
}  

/**  
 *  读取文件对象的 base64字符串  
 * @param {Object} file 5 app 的 文件对象  
 */  
function file_reader_as_data_url(file){  
    return new Promise((resolve,reject)=>{  
        try{  
            let fileReader =new plus.io.FileReader();  
            fileReader.onloadend = function(evt) {  
                resolve(evt.target.result)  
            };  
            fileReader.readAsDataURL(file,'UTF-8');  
        }catch(e){  
            //TODO handle the exception  
            reject(e)  
        }  
    })  
}
收起阅读 »

Ask chatGPT, 无需任何配置直接使用

ChatGPT HBuilderX

插件地址

chatGPT插件地址:https://ext.dcloud.net.cn/plugin?id=11702

预览

编辑器内选中需求,生成代码

编辑器,比如css文件,选中需求,点击【Coding ChatGPT】,即可获取对应代码。

使用action指令

编辑器,选中您要操作的文本,然后点击HBuilderX顶部菜单【工具】【Ask chatGPT】【打开action】,然后选择操作。

插件设置

HBuilderX顶部菜单【工具】【Ask chatGPT】【设置ApiKey和proxyURL】

新建对话

新建action

如何使用?

HBuilderX顶部菜单【工具】【Ask chatGPT】,即可打开chatGPT聊天视图。

继续阅读 »

插件地址

chatGPT插件地址:https://ext.dcloud.net.cn/plugin?id=11702

预览

编辑器内选中需求,生成代码

编辑器,比如css文件,选中需求,点击【Coding ChatGPT】,即可获取对应代码。

使用action指令

编辑器,选中您要操作的文本,然后点击HBuilderX顶部菜单【工具】【Ask chatGPT】【打开action】,然后选择操作。

插件设置

HBuilderX顶部菜单【工具】【Ask chatGPT】【设置ApiKey和proxyURL】

新建对话

新建action

如何使用?

HBuilderX顶部菜单【工具】【Ask chatGPT】,即可打开chatGPT聊天视图。

收起阅读 »