
Uniapp 基于若依框架 实现照片上传与 数据处理
1.照片通过上传到服务器后;返回照片地址信息;无法实现统一管理;
- 基于若依 uniapp版本;其没有自带的上传插件;需要自己改造
- 可以自行封装相应的上传组件;
1.照片通过上传到服务器后;返回照片地址信息;无法实现统一管理;
- 基于若依 uniapp版本;其没有自带的上传插件;需要自己改造
- 可以自行封装相应的上传组件;

uniCloud 上线支付宝云开发了,新用户 0 元购,双11狂欢!
支付宝云开发产品
是一款蚂蚁集团独立自研的 Serverless小程序一站式开发平台,当前已经在 uniCloud 中开放使用。

支付云开发完全兼容 uniCloud 开发生态,只需开通选择支付宝云开发,后续遵循已有开发方式。
新老用户回馈,新用户 0 元购,双11狂欢
好消息!云开发首次大促正在火爆进行中,详见下方活动参与方式。
uniCloud 支付宝云开发产品为广大用户提供了免费版、基础版、标准版、专业版、企业版和旗舰版等不同版本的套餐,也提供了不同超低折扣套餐:
新用户0元购活动:每个新用户首个环境 300元及以下套餐 0 元购 3 个月
2023年6月1日~2024年12月31日注册为新用户
注意:0元购套餐到期后用户可以选择续费,降配或者停服处理,不会自动扣费哦
小程序云双11大促活动:每个用户可享受 4.5折全量套餐优惠!此外还有欢乐抽奖,最高赢 iPhone 15 Pro!
活动时间:2023年11月1日~2023年11月30日
(悄悄地说,如果您购买云开发企业版及以下的套餐,可参与 0 元购活动。如果想购买旗舰版,可以使用小程序云双11大促活动的4.5折优惠券呦~)
本次抽奖活动限时1个月(11月1日-11月30日),抽奖池实物奖品占比高达75%哦
活动参与方式及抽奖规则
在uniCloud控制台注册并购买支付宝小程序云服务空间,具体抽奖规则如下:
1、新用户注册并累计账单金额(含优惠金额)满100元即可获得抽奖机会1次;
2、新老用户通过邀请码邀请新用户,累计账单金额(含优惠金额)满100元即可获得抽奖机会1次;
如何累计账单金额(含优惠金额)满100元?
- 购买云开发基础版4.5元/月套餐包,按量计费余额超过95.5 元;
- 购买云开发标准版22元/月套餐包5个月及以上;
- 购买云开发专业版76元/月套餐包1个月及以上;
- 购买云开发企业版300元/月套餐包;
- 购买云开发旗舰版652元/月套餐包
支付宝云开发提供更加优惠的套餐价格《价格列表》,支持套餐和按需付费混合使用,CDN 流量包多种灵活付费方式,最大程度上降低用户使用成本,让我们一起连接未来,创造无限!快来体验uniCloud支付宝小程序云版,享受无门槛试用和更多抽奖福利。
点击直通活动页面:https://unicloud.dcloud.net.cn/uni_modules/uni-trade/pages/create-order/create-order?buy_type=1
一键领取优惠大礼包:https://cloud.alipay.com/main/doubleElevenMarket?channel=318
支付宝云开发产品
是一款蚂蚁集团独立自研的 Serverless小程序一站式开发平台,当前已经在 uniCloud 中开放使用。
支付云开发完全兼容 uniCloud 开发生态,只需开通选择支付宝云开发,后续遵循已有开发方式。
新老用户回馈,新用户 0 元购,双11狂欢
好消息!云开发首次大促正在火爆进行中,详见下方活动参与方式。
uniCloud 支付宝云开发产品为广大用户提供了免费版、基础版、标准版、专业版、企业版和旗舰版等不同版本的套餐,也提供了不同超低折扣套餐:
新用户0元购活动:每个新用户首个环境 300元及以下套餐 0 元购 3 个月
2023年6月1日~2024年12月31日注册为新用户
注意:0元购套餐到期后用户可以选择续费,降配或者停服处理,不会自动扣费哦
小程序云双11大促活动:每个用户可享受 4.5折全量套餐优惠!此外还有欢乐抽奖,最高赢 iPhone 15 Pro!
活动时间:2023年11月1日~2023年11月30日
(悄悄地说,如果您购买云开发企业版及以下的套餐,可参与 0 元购活动。如果想购买旗舰版,可以使用小程序云双11大促活动的4.5折优惠券呦~)
本次抽奖活动限时1个月(11月1日-11月30日),抽奖池实物奖品占比高达75%哦
活动参与方式及抽奖规则
在uniCloud控制台注册并购买支付宝小程序云服务空间,具体抽奖规则如下:
1、新用户注册并累计账单金额(含优惠金额)满100元即可获得抽奖机会1次;
2、新老用户通过邀请码邀请新用户,累计账单金额(含优惠金额)满100元即可获得抽奖机会1次;
如何累计账单金额(含优惠金额)满100元?
- 购买云开发基础版4.5元/月套餐包,按量计费余额超过95.5 元;
- 购买云开发标准版22元/月套餐包5个月及以上;
- 购买云开发专业版76元/月套餐包1个月及以上;
- 购买云开发企业版300元/月套餐包;
- 购买云开发旗舰版652元/月套餐包
支付宝云开发提供更加优惠的套餐价格《价格列表》,支持套餐和按需付费混合使用,CDN 流量包多种灵活付费方式,最大程度上降低用户使用成本,让我们一起连接未来,创造无限!快来体验uniCloud支付宝小程序云版,享受无门槛试用和更多抽奖福利。
点击直通活动页面:https://unicloud.dcloud.net.cn/uni_modules/uni-trade/pages/create-order/create-order?buy_type=1
一键领取优惠大礼包:https://cloud.alipay.com/main/doubleElevenMarket?channel=318
收起阅读 »
uni.downloadFile url 中域名不能带下划线,否则会返回statusCode: 400
例如:
uni.downloadFile({
url: test_xxx.domain.com
})
这种会返回
{
"tempFilePath": "_doc/uniapp_temp_1699502244652/download/",
"statusCode": 400,
"errMsg": "downloadFile:ok"
}
并且onProgressUpdate
监听不到
例如:
uni.downloadFile({
url: test_xxx.domain.com
})
这种会返回
{
"tempFilePath": "_doc/uniapp_temp_1699502244652/download/",
"statusCode": 400,
"errMsg": "downloadFile:ok"
}
并且onProgressUpdate
监听不到

在 HbuilderX 中使用 GitHub Copilot 辅助编程
![]() |
& | ![]() |
链接
- 插件地址:https://ext.dcloud.net.cn/plugin?id=15241
- 仓库地址:https://github.com/zhetengbiji/copilot-for-hbuilderx
- 原文地址:https://zhetengbiji.com/p/2023/11/17/copilot-for-hbuilderx.html
关于
GitHub Copilot for HBuilderX
Your AI pair programmer
GitHub Copilot 使用 OpenAI Codex 从你的编辑器实时建议代码和整个函数。经过数十亿行公共代码的训练,GitHub Copilot 会启用自然语言提示,GitHub Copilot 可以将自然语言提示(包括注释和方法名)转换为数十种语言的编码建议。
本 HBuilderX 插件基于 GitHub Copilot 官方项目 Copilot.vim 开发。代码建议参考开源项目 CopilotForXcode、代码聊天参考开源项目 CopilotChat.nvim、插件配置参考 Visual Studio Code 官方插件 GitHub Copilot。
要了解更多 GitHub Copilot 信息,请访问 https://github.com/features/copilot.
订阅
GitHub Copilot 需要订阅。它对经过认证的学生和 GitHub 上流行的开源项目的维护者是免费的。
GitHub Copilot 受 GitHub 附加产品条款的约束。
使用方式
点击右下角 GitHub Copilot 图标进行登录,登录后在编辑代码时 GitHub Copilot 会自动给出建议。
- 接受建议:
Tab 键
- 拒绝建议:
Esc 键
- 主动触发编码建议:
Ctrl/Command 键
+Alt 键
+\ 键
- 开始代码聊天:
Ctrl/Command 键
+I 键
- 点击右下角 GitHub Copilot 图标 ->
开始代码聊天
- 编辑区选中代码右键,选择菜单
GitHub Copilot
->开始代码聊天
注意事项
- 首次安装后,如使用出现异常,可以尝试重启 HBuilderX。
- 卸载或者升级失败,可以尝试重启 HBuilderX。
- 部分地区访问 GitHub Copilot 较慢,可以尝试在编辑器设置中配置 GitHub Copilot 插件代理。
- GitHub Copilot Chat 为实验性功能,交互方式有待优化。
交流
- QQ 群:697588509
![]() |
& | ![]() |
链接
- 插件地址:https://ext.dcloud.net.cn/plugin?id=15241
- 仓库地址:https://github.com/zhetengbiji/copilot-for-hbuilderx
- 原文地址:https://zhetengbiji.com/p/2023/11/17/copilot-for-hbuilderx.html
关于
GitHub Copilot for HBuilderX
Your AI pair programmer
GitHub Copilot 使用 OpenAI Codex 从你的编辑器实时建议代码和整个函数。经过数十亿行公共代码的训练,GitHub Copilot 会启用自然语言提示,GitHub Copilot 可以将自然语言提示(包括注释和方法名)转换为数十种语言的编码建议。
本 HBuilderX 插件基于 GitHub Copilot 官方项目 Copilot.vim 开发。代码建议参考开源项目 CopilotForXcode、代码聊天参考开源项目 CopilotChat.nvim、插件配置参考 Visual Studio Code 官方插件 GitHub Copilot。
要了解更多 GitHub Copilot 信息,请访问 https://github.com/features/copilot.
订阅
GitHub Copilot 需要订阅。它对经过认证的学生和 GitHub 上流行的开源项目的维护者是免费的。
GitHub Copilot 受 GitHub 附加产品条款的约束。
使用方式
点击右下角 GitHub Copilot 图标进行登录,登录后在编辑代码时 GitHub Copilot 会自动给出建议。
- 接受建议:
Tab 键
- 拒绝建议:
Esc 键
- 主动触发编码建议:
Ctrl/Command 键
+Alt 键
+\ 键
- 开始代码聊天:
Ctrl/Command 键
+I 键
- 点击右下角 GitHub Copilot 图标 ->
开始代码聊天
- 编辑区选中代码右键,选择菜单
GitHub Copilot
->开始代码聊天
注意事项
- 首次安装后,如使用出现异常,可以尝试重启 HBuilderX。
- 卸载或者升级失败,可以尝试重启 HBuilderX。
- 部分地区访问 GitHub Copilot 较慢,可以尝试在编辑器设置中配置 GitHub Copilot 插件代理。
- GitHub Copilot Chat 为实验性功能,交互方式有待优化。
交流
- QQ 群:697588509

uniapp 内嵌 unity(安卓离线打包)
unity 项目导出
file —— build settings,将平台切换为 android 平台,导出即可。
导出的工程目录结构如上,unityLibrary 目录下的工程可以 build 出一个 aar 的包。
launcher 目录下的工程依赖 unityLibrary 工程,可以用来 build 出来一个 apk 应用。
此后需要按照导出为含有源代码的 Android 项目工程方式将其导入 android studio 中,之后需要开展如下几个步骤的模块配置:
按照 Unity3d 官方例子,在安卓项目同级创建文件夹 UnityProject->androidBuild
将 Unity3d 导出的项目拷入 androidBuild 文件夹下。
安卓中嵌入该 Unity3d 项目,作为一个 module 进行调用
以上为项目目录
1)setting.gradle 文件添加 unityLibrary module(:HBuilder-Integrate-AS)
include ':unityLibrary'
project(':unityLibrary').projectDir=new File('..\\UnityProject\\androidBuild\\unityLibrary')
2)选择 build.gradle 添加 dependencies(:simpleDemo)
dependencies {
implementation project(':unityLibrary')
implementation fileTree(dir: project(':unityLibrary').getProjectDir().toString() + ('\\libs'), include: ['*.jar'])
}
3)选择 build.gradle(:HBuilder-Integrate-AS)
allprojects {
repositories {
google()
jcenter()
// Add Code
flatDir {
dirs "${project(':unityLibrary').projectDir}/libs"
}
}
}
4)选择 src main res strings.xml 增加,点击 AS 的 sync project,可以看到已经多了一个 module (:simpleDemo)。
// 选择 NativeAndroidApp 的 strings.xml 添加,点击 AS 的 sync project,可以看到已经多了一个 module
<resources>
<string name="app_name">NativeAndroidApp</string>
// Add Code
<string name="game_view_content_description">Game view</string>
// End
</resources>
5)在主运行程序的 app(simpleDemo) 下的 main->assets->dcloud_uniplugin.json 添加依赖,其中 name 为插件名(:simpleDemo)
"plugins": [
{
"type": "module",
"name": "Unity",
"class": "com.unity3d.player.UnityPlayerActivity"
}
1)将 AndroidManifest.xml 中 intent-filter 节点注释掉(:unityLibrary)
2).将除了 unity-classes.jar 包以外的包拷入 app 下的 lib 中,用于项目的引用包(这里的app就是我项目的simpleDemo)
3)将 build.gradle(unityLibrary)中相关包引用注释掉。
3.uniapp-Unity3d 应用在 android 中的交互
通过 uni-app 中点击按钮事件对 Unity3d 界面进行调用,另一方面 Unity3d 中设置返回按钮,进行 Unity3d 界面退出,返回安卓界面,最终实现 uniapp-Unity3d 在安卓中的交互。具体实现方法如下:
(1)uni-app 对 Unity3d 的调用:
goActivity(){
var main = plus.android.runtimeMainActivity();
var Intent = plus.android.importClass("android.content.Intent");
var intent = new Intent(main.getIntent());
intent.setClassName(main, "com.unity3d.player.UnityPlayerActivity");
intent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
main.startActivity(intent);
},
(2)Unity3d 中返回按钮调用安卓端的实现
AndroidJavaClass jc = new AndroidJavaClass("com.unity3d.player.UnityPlayer");
AndroidJavaObject jo = jc.GetStatic<AndroidJavaObject>("currentActivity");
jo.Call("onBackPressed");
(3)安卓端对 Unity3d 信息的接收,退出 Unity3d,返回安卓界面。
@Override
public void onBackPressed() {
runOnUiThread(new Runnable() {
@Override
public void run() {
mUnityPlayer.quit();
}
});
super.onBackPressed();
}
unity 项目导出
file —— build settings,将平台切换为 android 平台,导出即可。
导出的工程目录结构如上,unityLibrary 目录下的工程可以 build 出一个 aar 的包。
launcher 目录下的工程依赖 unityLibrary 工程,可以用来 build 出来一个 apk 应用。
此后需要按照导出为含有源代码的 Android 项目工程方式将其导入 android studio 中,之后需要开展如下几个步骤的模块配置:
按照 Unity3d 官方例子,在安卓项目同级创建文件夹 UnityProject->androidBuild
将 Unity3d 导出的项目拷入 androidBuild 文件夹下。
安卓中嵌入该 Unity3d 项目,作为一个 module 进行调用
以上为项目目录
1)setting.gradle 文件添加 unityLibrary module(:HBuilder-Integrate-AS)
include ':unityLibrary'
project(':unityLibrary').projectDir=new File('..\\UnityProject\\androidBuild\\unityLibrary')
2)选择 build.gradle 添加 dependencies(:simpleDemo)
dependencies {
implementation project(':unityLibrary')
implementation fileTree(dir: project(':unityLibrary').getProjectDir().toString() + ('\\libs'), include: ['*.jar'])
}
3)选择 build.gradle(:HBuilder-Integrate-AS)
allprojects {
repositories {
google()
jcenter()
// Add Code
flatDir {
dirs "${project(':unityLibrary').projectDir}/libs"
}
}
}
4)选择 src main res strings.xml 增加,点击 AS 的 sync project,可以看到已经多了一个 module (:simpleDemo)。
// 选择 NativeAndroidApp 的 strings.xml 添加,点击 AS 的 sync project,可以看到已经多了一个 module
<resources>
<string name="app_name">NativeAndroidApp</string>
// Add Code
<string name="game_view_content_description">Game view</string>
// End
</resources>
5)在主运行程序的 app(simpleDemo) 下的 main->assets->dcloud_uniplugin.json 添加依赖,其中 name 为插件名(:simpleDemo)
"plugins": [
{
"type": "module",
"name": "Unity",
"class": "com.unity3d.player.UnityPlayerActivity"
}
1)将 AndroidManifest.xml 中 intent-filter 节点注释掉(:unityLibrary)
2).将除了 unity-classes.jar 包以外的包拷入 app 下的 lib 中,用于项目的引用包(这里的app就是我项目的simpleDemo)
3)将 build.gradle(unityLibrary)中相关包引用注释掉。
3.uniapp-Unity3d 应用在 android 中的交互
通过 uni-app 中点击按钮事件对 Unity3d 界面进行调用,另一方面 Unity3d 中设置返回按钮,进行 Unity3d 界面退出,返回安卓界面,最终实现 uniapp-Unity3d 在安卓中的交互。具体实现方法如下:
(1)uni-app 对 Unity3d 的调用:
goActivity(){
var main = plus.android.runtimeMainActivity();
var Intent = plus.android.importClass("android.content.Intent");
var intent = new Intent(main.getIntent());
intent.setClassName(main, "com.unity3d.player.UnityPlayerActivity");
intent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
main.startActivity(intent);
},
(2)Unity3d 中返回按钮调用安卓端的实现
AndroidJavaClass jc = new AndroidJavaClass("com.unity3d.player.UnityPlayer");
AndroidJavaObject jo = jc.GetStatic<AndroidJavaObject>("currentActivity");
jo.Call("onBackPressed");
(3)安卓端对 Unity3d 信息的接收,退出 Unity3d,返回安卓界面。
@Override
public void onBackPressed() {
runOnUiThread(new Runnable() {
@Override
public void run() {
mUnityPlayer.quit();
}
});
super.onBackPressed();
}
收起阅读 »

拦截器uni.addInterceptor会拦截带参数的URL的BUG
拦截器uni.addInterceptor会拦截带参数的URL 。
在白名单设置了通行:/page/index/detail ,如果在跳转在URL中有参数,如/page/index/detail?id=12,则会被拦截器拦截。
不过可加两行代码即可解决这个问题:
在uni.addInterceptor 代码段中,把
if(!hasPermission(e.url)){
修改为:
const url = e.url.split('?')[0]
if(!hasPermission(url)){
即可。
拦截器uni.addInterceptor会拦截带参数的URL 。
在白名单设置了通行:/page/index/detail ,如果在跳转在URL中有参数,如/page/index/detail?id=12,则会被拦截器拦截。
不过可加两行代码即可解决这个问题:
在uni.addInterceptor 代码段中,把
if(!hasPermission(e.url)){
修改为:
const url = e.url.split('?')[0]
if(!hasPermission(url)){
即可。

【解决】APP(ios端)没有Promise.allSettled
if (!Promise.allSettled) {
const rejectHandler = reason => ({ status: 'rejected', reason });
const resolveHandler = value => ({ status: 'fulfilled', value });
Promise.allSettled = function (promises) {
const convertedPromises = promises.map(p => Promise.resolve(p).then(resolveHandler, rejectHandler));
return Promise.all(convertedPromises);
};
}
来源:有点久远,百度的
↓↓↓ 各位大佬点点赞
if (!Promise.allSettled) {
const rejectHandler = reason => ({ status: 'rejected', reason });
const resolveHandler = value => ({ status: 'fulfilled', value });
Promise.allSettled = function (promises) {
const convertedPromises = promises.map(p => Promise.resolve(p).then(resolveHandler, rejectHandler));
return Promise.all(convertedPromises);
};
}
来源:有点久远,百度的
↓↓↓ 各位大佬点点赞
收起阅读 »
Wot Design Uni 增加 Sidebar 侧边栏组件 ,赶快进来看看效果吧!
Sidebar 侧边栏
垂直展示的导航栏,用于在不同的内容区域之间进行切换。
地址
先看交互效果
基础用法
通过 v-model
绑定当前选中项的索引。
<wd-sidebar v-model="active">
<wd-sidebar-item :value="0" label="标签名称" />
<wd-sidebar-item :value="1" label="标签名称" />
<wd-sidebar-item :value="2" label="标签名称" />
</wd-sidebar>
const active = ref(0)
徽标提示
设置 is-dot
属性后,会在右上角展示一个小红点;设置 badge
属性后,会在右上角展示相应的徽标。
<wd-sidebar v-model="active">
<wd-sidebar-item :value="0" label="标签名称" is-dot />
<wd-sidebar-item :value="1" label="标签名称" badge="5" />
<wd-sidebar-item :value="2" label="标签名称" />
</wd-sidebar>
禁用选项
通过 disabled
属性禁用选项。
<wd-sidebar v-model="active">
<wd-sidebar-item :value="0" label="标签名称" />
<wd-sidebar-item :value="1" label="标签名称" disabled />
<wd-sidebar-item :value="2" label="标签名称" />
</wd-sidebar>
监听切换事件
设置 change
方法来监听切换导航项时的事件。
<wd-sidebar v-model="active" @change="handleChange">
<wd-sidebar-item :value="0" label="标签名称 1" />
<wd-sidebar-item :value="1" label="标签名称 2" />
<wd-sidebar-item :value="2" label="标签名称 3" />
</wd-sidebar>
import { useToast } from '@/uni_modules/wot-design-uni'
const toast = useToast()
const active = ref<number>(1)
function handleChange({ value, label }) {
toast.show(`当前标签名 ${label}`)
}
锚点用法示例
sidebar组件的锚点用法可以帮助用户在长页面上快速导航到特定的部分。
见文档
切换页面用法示例
sidebar组件在每次切换激活项时,跳转到指定的页面,且无法通过滚动导航到下一个sidebar项。
Attributes
参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
---|---|---|---|---|---|
modelValue/v-model | 当前导航项的索引 | string | number | - | 0 | 0.1.49 |
Events
事件名称 | 说明 | 参数 | 最低版本 |
---|---|---|---|
change | 选项切换时触发 | (value: number \| string, label: string) |
0.1.49 |
Slots
name | 说明 | 参数 | 最低版本 |
---|---|---|---|
default | 自定义展示 | - | 0.1.49 |
外部样式类
类名 | 说明 | 最低版本 |
---|---|---|
customStyle | 自定义样式 | 0.1.49 |
customClass | 自定义样式类 | 0.1.49 |
SidebarItem Attributes
参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
---|---|---|---|---|---|
label | 当前选项标题 | string | - | - | 0.1.49 |
value | 当前选项的值,唯一标识 | number \| string |
- | - | 0.1.49 |
badge | 徽标显示值 | number \| string \| null |
- | - | 0.1.49 |
icon | 图标 | string | - | - | 0.1.49 |
isDot | 是否点状徽标 | boolean | - | false | 0.1.49 |
max | 徽标最大值 | number | - | 99 | 0.1.49 |
disabled | 是否禁用 | boolean | - | false | 0.1.49 |
SidebarItem Slots
name | 说明 | 参数 | 最低版本 |
---|---|---|---|
icon | 自定义图标 | - | 0.1.49 |
SidebarItem 外部样式类
类名 | 说明 | 最低版本 |
---|---|---|
customStyle | 自定义样式 | 0.1.49 |
customClass | 自定义样式类 | 0.1.49 |
地址
Sidebar 侧边栏
垂直展示的导航栏,用于在不同的内容区域之间进行切换。
地址
先看交互效果
基础用法
通过 v-model
绑定当前选中项的索引。
<wd-sidebar v-model="active">
<wd-sidebar-item :value="0" label="标签名称" />
<wd-sidebar-item :value="1" label="标签名称" />
<wd-sidebar-item :value="2" label="标签名称" />
</wd-sidebar>
const active = ref(0)
徽标提示
设置 is-dot
属性后,会在右上角展示一个小红点;设置 badge
属性后,会在右上角展示相应的徽标。
<wd-sidebar v-model="active">
<wd-sidebar-item :value="0" label="标签名称" is-dot />
<wd-sidebar-item :value="1" label="标签名称" badge="5" />
<wd-sidebar-item :value="2" label="标签名称" />
</wd-sidebar>
禁用选项
通过 disabled
属性禁用选项。
<wd-sidebar v-model="active">
<wd-sidebar-item :value="0" label="标签名称" />
<wd-sidebar-item :value="1" label="标签名称" disabled />
<wd-sidebar-item :value="2" label="标签名称" />
</wd-sidebar>
监听切换事件
设置 change
方法来监听切换导航项时的事件。
<wd-sidebar v-model="active" @change="handleChange">
<wd-sidebar-item :value="0" label="标签名称 1" />
<wd-sidebar-item :value="1" label="标签名称 2" />
<wd-sidebar-item :value="2" label="标签名称 3" />
</wd-sidebar>
import { useToast } from '@/uni_modules/wot-design-uni'
const toast = useToast()
const active = ref<number>(1)
function handleChange({ value, label }) {
toast.show(`当前标签名 ${label}`)
}
锚点用法示例
sidebar组件的锚点用法可以帮助用户在长页面上快速导航到特定的部分。
见文档
切换页面用法示例
sidebar组件在每次切换激活项时,跳转到指定的页面,且无法通过滚动导航到下一个sidebar项。
Attributes
参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
---|---|---|---|---|---|
modelValue/v-model | 当前导航项的索引 | string | number | - | 0 | 0.1.49 |
Events
事件名称 | 说明 | 参数 | 最低版本 |
---|---|---|---|
change | 选项切换时触发 | (value: number \| string, label: string) |
0.1.49 |
Slots
name | 说明 | 参数 | 最低版本 |
---|---|---|---|
default | 自定义展示 | - | 0.1.49 |
外部样式类
类名 | 说明 | 最低版本 |
---|---|---|
customStyle | 自定义样式 | 0.1.49 |
customClass | 自定义样式类 | 0.1.49 |
SidebarItem Attributes
参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
---|---|---|---|---|---|
label | 当前选项标题 | string | - | - | 0.1.49 |
value | 当前选项的值,唯一标识 | number \| string |
- | - | 0.1.49 |
badge | 徽标显示值 | number \| string \| null |
- | - | 0.1.49 |
icon | 图标 | string | - | - | 0.1.49 |
isDot | 是否点状徽标 | boolean | - | false | 0.1.49 |
max | 徽标最大值 | number | - | 99 | 0.1.49 |
disabled | 是否禁用 | boolean | - | false | 0.1.49 |
SidebarItem Slots
name | 说明 | 参数 | 最低版本 |
---|---|---|---|
icon | 自定义图标 | - | 0.1.49 |
SidebarItem 外部样式类
类名 | 说明 | 最低版本 |
---|---|---|
customStyle | 自定义样式 | 0.1.49 |
customClass | 自定义样式类 | 0.1.49 |
地址
收起阅读 »
uniapp创建企微在ios端wx.config 以及wx.agentConfig问题的完美解决
之前写过一篇解决的文章 但是 后续发现还是有那么一点问题 就是ios 在调用 agentConfig的API 的时候会发现 agentConfig 找不到 是 undefined。
https://developer.work.weixin.qq.com/community/article/detail?content_id=16288602254668494166
之前的文章,通过后学的摸索,终于完美解决了。
步骤一:创建项目
我们知道 官方然我们在项目中 需要建立一个 index.html 文件用于 引入企微的SDK。我发现及时在index.html中引入了,uniapp在打包的时候还是会占用wx这个类,说明uniapp内部还是一个异步的过程。因此我们需要动态引入,而不是 在index中引入。
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>
<%= htmlWebpackPlugin.options.title %>
</title>
<script>
document.addEventListener('DOMContentLoaded', function() {
document.documentElement.style.fontSize = document.documentElement.clientWidth / 20 + 'px'
})
window.wx = null;
</script>
<link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
<!-- 企业微信h5授权 config注入 -->
<!-- <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script> -->
<!-- 调用 wx.agentConfig需要引入 jwxwork sdk -->
<!-- <script type="text/javascript" src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js"></script> -->
<!-- 用于调试所用 -->
<script type="text/javascript" src="https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/mobile-detect@1.4.5/mobile-detect.min.js"></script>
<script type="text/javascript">
delete window.wx;
</script>
<head>
因此 在index中我们只引入 vconsole 就行了 不要引入企微的SDK。后续我们通过动态引入
二:动态引入sdk 并注册
我们可以在工程中建立一个专门的 企微的工具库 ,我的工程是放在一起的 没有分开。你可以根据自己的逻辑来建立库 我的库为 ESUtils.js 并将 企微的方法全放在了 wxUntils中
我们动态 引入SDK,动态引入
createdScript: function(callback) {
// window.wx = null;
let userInfo = ESUtils.ESDB.getLoginInfo(); //自己存的相关缓存
const script1 = document.createElement("script");
script1.setAttribute("type", "text/javascript");
script1.setAttribute("referrerpolicy", "origin");
script1.setAttribute("src", "https://res.wx.qq.com/open/js/jweixin-1.2.0.js");
document.head.appendChild(script1);
script1.onload = function() {
const script2 = document.createElement("script");
script2.setAttribute("type", "text/javascript");
script2.setAttribute("referrerpolicy", "origin");
script2.setAttribute("src", "https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js");
document.head.appendChild(script2);
script2.onload = () => {
callback && callback(userInfo)
}
}
},
注册 config
initJssdk: function(callback) {
this.createdScript((userInfo) => {
ESUtils.network.request({
url: userInfo.server,
data: {
method: "Work_WXInitJSSDK", //初始化SDK
userId:userInfo.userId,
url:userInfo.url,
cropId:userInfo.cropId
},
success: res => {
if (res.data.response.code == 200) {
let info = res.data.body; //需要判断 ios 还是 安卓
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(ESUtils.wxUntils.system)) {
wx.config({
beta: true, // 必须这么写,否则wx.invoke调用形式的jsapi会有问题
debug: false, // 开启调试模式
appId: info.appId, // 必填,企业微信的corpID
timestamp: info.timestamp, // 必填,生成签名的时间戳
nonceStr: info.nonceStr, // 必填,生成签名的随机串
signature: info.signature, // 必填,签名,见 附录-JS-SDK使用权限签名算法
jsApiList: [
'chooseImage',
'scanQRCode',
'previewImage',
'getLocation',
'previewFile',
'openLocation',
'uploadImage',
'getLocalImgData',
'downloadImage',
'startRecord',
'stopRecord',
'onVoiceRecordEnd',
'playVoice',
'pauseVoice',
'stopVoice',
'onVoicePlayEnd',
'uploadVoice',
'downloadVoice',
'translateVoice'
]
});
wx.ready((res) => {
callback && callback(info);
})
wx.error((err) => {
});
}else{
jWeixin.config({
beta: true, // 必须这么写,否则wx.invoke调用形式的jsapi会有问题
debug: false, // 开启调试模式
appId: info.appId, // 必填,企业微信的corpID
timestamp: info.timestamp, // 必填,生成签名的时间戳
nonceStr: info.nonceStr, // 必填,生成签名的随机串
signature: info.signature, // 必填,签名,见 附录-JS-SDK使用权限签名算法
jsApiList: [
'chooseImage',
'scanQRCode',
'previewImage',
'getLocation',
'previewFile',
'openLocation',
'uploadImage',
'getLocalImgData',
'downloadImage',
'startRecord',
'stopRecord',
'onVoiceRecordEnd',
'playVoice',
'pauseVoice',
'stopVoice',
'onVoicePlayEnd',
'uploadVoice',
'downloadVoice',
'translateVoice'
]
});
jWeixin.ready((res) => {
callback && callback(info);
})
jWeixin.error((err) => {
});
}
}
}
});
});
},
注册 agentConfig
//agentConfig必须是 config注册成功后才能 注册
initJssdkAgent: function(callback) {
ESUtils.wxUntils.initJssdk((info) => {
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(ESUtils.wxUntils.system)) {
setTimeout(()=>{
wx.agentConfig({
corpid: info.appId, // 必填,企业微信的corpid,必须与当前登录的企业一致
agentid: info.angetId, // 必填,企业微信的应用id (e.g. 1000247)
timestamp: info.timestamp, // 必填,生成签名的时间戳
nonceStr: info.nonceStr, // 必填,生成签名的随机串
signature: info.signature1, // 必填,签名,见附录-JS-SDK使用权限签名算法
jsApiList: [
"selectEnterpriseContact",
"getContext",
"getCurExternalContact",
"openUserProfile",
"getCurExternalChat",
"selectExternalContact",
"selectPrivilegedContact",
"createChatWithMsg",
"sendChatMessage",
"openExistedChatWithMsg",
"shareToExternalContact",
"shareToExternalChat",
"setShareAttr",
"getShareInfo",
"shareAppMessage", //自定义转发发到会话
"shareWechatMessage", //自定义转发到微信
"openEnterpriseChat"
],
success: res => {
callback && callback(res)
},
fail: err => {
callback && callback(err)
}
});
}, 1000);
}else{
setTimeout(()=>{
jWeixin.agentConfig({
corpid: info.appId, // 必填,企业微信的corpid,必须与当前登录的企业一致
agentid: info.angetId, // 必填,企业微信的应用id (e.g. 1000247)
timestamp: info.timestamp, // 必填,生成签名的时间戳
nonceStr: info.nonceStr, // 必填,生成签名的随机串
signature: info.signature1, // 必填,签名,见附录-JS-SDK使用权限签名算法
jsApiList: [
"selectEnterpriseContact",
"getContext",
"getCurExternalContact",
"openUserProfile",
"getCurExternalChat",
"selectExternalContact",
"selectPrivilegedContact",
"createChatWithMsg",
"sendChatMessage",
"openExistedChatWithMsg",
"shareToExternalContact",
"shareToExternalChat",
"setShareAttr",
"getShareInfo",
"shareAppMessage", //自定义转发发到会话
"shareWechatMessage", //自定义转发到微信
"openEnterpriseChat"
],
success: res => {
callback && callback(res)
},
fail: err => {
callback && callback(err)
}
});
}, 1000);
}
});
},
现在我们就已经解决了 初始化及注册的问题了,然后我们将我们需要用到的 API 进行二次封装
//扫一扫的 API
scanCode: function(callback) {
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(ESUtils.wxUntils.system)) {
wx.scanQRCode({
desc: 'scanQRCode desc',
needResult: 1, // 默认为0,扫描结果由企业微信处理,1则直接返回扫描结果,
scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是条形码(一维码),默认二者都有
success: function(res) {
callback && callback(res);
}
});
}else{
jWeixin.scanQRCode({
desc: 'scanQRCode desc',
needResult: 1, // 默认为0,扫描结果由企业微信处理,1则直接返回扫描结果,
scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是条形码(一维码),默认二者都有
success: function(res) {
callback && callback(res);
}
});
}
},
//获取进入H5页面的入口环境
getContext: function(callback) {
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(ESUtils.wxUntils.system)) {
wx.invoke('getContext', {}, (res) => {
callback && callback(res)
});
}else{
jWeixin.invoke('getContext', {}, (res) => {
callback && callback(res)
});
}
},
// 选择外部联系人
selectEContact: function(callback) {
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(ESUtils.wxUntils.system)) {
wx.invoke('selectExternalContact', {
"filterType": 0, //0表示展示全部外部联系人列表,1表示仅展示未曾选择过的外部联系人。默认值为0;除了0与1,其他值非法。在企业微信2.4.22及以后版本支持该参数
}, (res) => {
if (res.err_msg == "selectExternalContact:ok") {
callback && callback(res, 1);
} else {
callback && callback(res, 0);
}
});
}else{
jWeixin.invoke('selectExternalContact', {
"filterType": 0, //0表示展示全部外部联系人列表,1表示仅展示未曾选择过的外部联系人。默认值为0;除了0与1,其他值非法。在企业微信2.4.22及以后版本支持该参数
}, (res) => {
if (res.err_msg == "selectExternalContact:ok") {
callback && callback(res, 1);
} else {
callback && callback(res, 0);
}
});
}
},
上述为一部分的API封装
三:页面的使用
做完所有的准备工作后,我们就需要进行项目的建立了 首先我们需要在页面中进行引入。
index.vue。
这个有一个非常重要的信息,我最开始 也是 这样然后再页面引入了但是我通过console 发现 当第一次进入的时候 在ios中无法识别出 agentConfig,一次偶然的时机我通过刷新一次页面后发现就能抽取出来,但是 动态引入只能引入一次,因此我决定更具这个情况进行曲线救国策略。
在index.vue中
onload(option){
var url = document.location.href;
let value = ESUtils.fn.getQueryString("eventType");
//每次进入index的我们让他自动刷新一次
if(url.indexOf("refreshed=") == -1){
var time = new Date();
window.location.href=url+"&refreshed="+time.getTime();
}
this.$nextTick(()=>{
let cropId = ESUtils.ESDB.getLoginInfo().cropId;
let userId = ESUtils.ESDB.getLoginInfo().id;
let url = window.location.href;
ESUtils.wxUntils.initJssdkAgent(res=>{
//引入并注册SDK
WWOpenData.bind(document.querySelectorAll('ww-open-data'));
ESUtils.wxUntils.getContext(result=>{ //这是判断是否 从快捷栏进入的 从而跳转指定的页面 并将入口的参数传过去
var loginInfo = ESUtils.ESDB.getLoginInfo();
if(url.indexOf("refreshed=") != -1){
if(option.eventType && option.eventType != ""){
var push = ESPush[option.eventType];
var params = '?pushEventId=' + option.eventId + "&workWX=" + result.entry;
let page = "";
if(ESUtils.ESDB.getLoginInfo().isJava == 1){
page = push.page_java;
}else{
page = push.page;
}
push && uni.navigateTo({
url: page + params
});
}
}
});
})
});
}
通过这样 我们就可以发现 在ios 和安卓中我们都可以进行兼容了 ,不会出现 wx.config 或者 wx.agnetConfig 为undefined的问题了。注意 其他的界面最好不要再调用 initJssdkAgent()方法了
如果 其他的朋友还有更好的解决方法,可以多多交流
之前写过一篇解决的文章 但是 后续发现还是有那么一点问题 就是ios 在调用 agentConfig的API 的时候会发现 agentConfig 找不到 是 undefined。
https://developer.work.weixin.qq.com/community/article/detail?content_id=16288602254668494166
之前的文章,通过后学的摸索,终于完美解决了。
步骤一:创建项目
我们知道 官方然我们在项目中 需要建立一个 index.html 文件用于 引入企微的SDK。我发现及时在index.html中引入了,uniapp在打包的时候还是会占用wx这个类,说明uniapp内部还是一个异步的过程。因此我们需要动态引入,而不是 在index中引入。
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>
<%= htmlWebpackPlugin.options.title %>
</title>
<script>
document.addEventListener('DOMContentLoaded', function() {
document.documentElement.style.fontSize = document.documentElement.clientWidth / 20 + 'px'
})
window.wx = null;
</script>
<link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
<!-- 企业微信h5授权 config注入 -->
<!-- <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script> -->
<!-- 调用 wx.agentConfig需要引入 jwxwork sdk -->
<!-- <script type="text/javascript" src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js"></script> -->
<!-- 用于调试所用 -->
<script type="text/javascript" src="https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/mobile-detect@1.4.5/mobile-detect.min.js"></script>
<script type="text/javascript">
delete window.wx;
</script>
<head>
因此 在index中我们只引入 vconsole 就行了 不要引入企微的SDK。后续我们通过动态引入
二:动态引入sdk 并注册
我们可以在工程中建立一个专门的 企微的工具库 ,我的工程是放在一起的 没有分开。你可以根据自己的逻辑来建立库 我的库为 ESUtils.js 并将 企微的方法全放在了 wxUntils中
我们动态 引入SDK,动态引入
createdScript: function(callback) {
// window.wx = null;
let userInfo = ESUtils.ESDB.getLoginInfo(); //自己存的相关缓存
const script1 = document.createElement("script");
script1.setAttribute("type", "text/javascript");
script1.setAttribute("referrerpolicy", "origin");
script1.setAttribute("src", "https://res.wx.qq.com/open/js/jweixin-1.2.0.js");
document.head.appendChild(script1);
script1.onload = function() {
const script2 = document.createElement("script");
script2.setAttribute("type", "text/javascript");
script2.setAttribute("referrerpolicy", "origin");
script2.setAttribute("src", "https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js");
document.head.appendChild(script2);
script2.onload = () => {
callback && callback(userInfo)
}
}
},
注册 config
initJssdk: function(callback) {
this.createdScript((userInfo) => {
ESUtils.network.request({
url: userInfo.server,
data: {
method: "Work_WXInitJSSDK", //初始化SDK
userId:userInfo.userId,
url:userInfo.url,
cropId:userInfo.cropId
},
success: res => {
if (res.data.response.code == 200) {
let info = res.data.body; //需要判断 ios 还是 安卓
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(ESUtils.wxUntils.system)) {
wx.config({
beta: true, // 必须这么写,否则wx.invoke调用形式的jsapi会有问题
debug: false, // 开启调试模式
appId: info.appId, // 必填,企业微信的corpID
timestamp: info.timestamp, // 必填,生成签名的时间戳
nonceStr: info.nonceStr, // 必填,生成签名的随机串
signature: info.signature, // 必填,签名,见 附录-JS-SDK使用权限签名算法
jsApiList: [
'chooseImage',
'scanQRCode',
'previewImage',
'getLocation',
'previewFile',
'openLocation',
'uploadImage',
'getLocalImgData',
'downloadImage',
'startRecord',
'stopRecord',
'onVoiceRecordEnd',
'playVoice',
'pauseVoice',
'stopVoice',
'onVoicePlayEnd',
'uploadVoice',
'downloadVoice',
'translateVoice'
]
});
wx.ready((res) => {
callback && callback(info);
})
wx.error((err) => {
});
}else{
jWeixin.config({
beta: true, // 必须这么写,否则wx.invoke调用形式的jsapi会有问题
debug: false, // 开启调试模式
appId: info.appId, // 必填,企业微信的corpID
timestamp: info.timestamp, // 必填,生成签名的时间戳
nonceStr: info.nonceStr, // 必填,生成签名的随机串
signature: info.signature, // 必填,签名,见 附录-JS-SDK使用权限签名算法
jsApiList: [
'chooseImage',
'scanQRCode',
'previewImage',
'getLocation',
'previewFile',
'openLocation',
'uploadImage',
'getLocalImgData',
'downloadImage',
'startRecord',
'stopRecord',
'onVoiceRecordEnd',
'playVoice',
'pauseVoice',
'stopVoice',
'onVoicePlayEnd',
'uploadVoice',
'downloadVoice',
'translateVoice'
]
});
jWeixin.ready((res) => {
callback && callback(info);
})
jWeixin.error((err) => {
});
}
}
}
});
});
},
注册 agentConfig
//agentConfig必须是 config注册成功后才能 注册
initJssdkAgent: function(callback) {
ESUtils.wxUntils.initJssdk((info) => {
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(ESUtils.wxUntils.system)) {
setTimeout(()=>{
wx.agentConfig({
corpid: info.appId, // 必填,企业微信的corpid,必须与当前登录的企业一致
agentid: info.angetId, // 必填,企业微信的应用id (e.g. 1000247)
timestamp: info.timestamp, // 必填,生成签名的时间戳
nonceStr: info.nonceStr, // 必填,生成签名的随机串
signature: info.signature1, // 必填,签名,见附录-JS-SDK使用权限签名算法
jsApiList: [
"selectEnterpriseContact",
"getContext",
"getCurExternalContact",
"openUserProfile",
"getCurExternalChat",
"selectExternalContact",
"selectPrivilegedContact",
"createChatWithMsg",
"sendChatMessage",
"openExistedChatWithMsg",
"shareToExternalContact",
"shareToExternalChat",
"setShareAttr",
"getShareInfo",
"shareAppMessage", //自定义转发发到会话
"shareWechatMessage", //自定义转发到微信
"openEnterpriseChat"
],
success: res => {
callback && callback(res)
},
fail: err => {
callback && callback(err)
}
});
}, 1000);
}else{
setTimeout(()=>{
jWeixin.agentConfig({
corpid: info.appId, // 必填,企业微信的corpid,必须与当前登录的企业一致
agentid: info.angetId, // 必填,企业微信的应用id (e.g. 1000247)
timestamp: info.timestamp, // 必填,生成签名的时间戳
nonceStr: info.nonceStr, // 必填,生成签名的随机串
signature: info.signature1, // 必填,签名,见附录-JS-SDK使用权限签名算法
jsApiList: [
"selectEnterpriseContact",
"getContext",
"getCurExternalContact",
"openUserProfile",
"getCurExternalChat",
"selectExternalContact",
"selectPrivilegedContact",
"createChatWithMsg",
"sendChatMessage",
"openExistedChatWithMsg",
"shareToExternalContact",
"shareToExternalChat",
"setShareAttr",
"getShareInfo",
"shareAppMessage", //自定义转发发到会话
"shareWechatMessage", //自定义转发到微信
"openEnterpriseChat"
],
success: res => {
callback && callback(res)
},
fail: err => {
callback && callback(err)
}
});
}, 1000);
}
});
},
现在我们就已经解决了 初始化及注册的问题了,然后我们将我们需要用到的 API 进行二次封装
//扫一扫的 API
scanCode: function(callback) {
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(ESUtils.wxUntils.system)) {
wx.scanQRCode({
desc: 'scanQRCode desc',
needResult: 1, // 默认为0,扫描结果由企业微信处理,1则直接返回扫描结果,
scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是条形码(一维码),默认二者都有
success: function(res) {
callback && callback(res);
}
});
}else{
jWeixin.scanQRCode({
desc: 'scanQRCode desc',
needResult: 1, // 默认为0,扫描结果由企业微信处理,1则直接返回扫描结果,
scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是条形码(一维码),默认二者都有
success: function(res) {
callback && callback(res);
}
});
}
},
//获取进入H5页面的入口环境
getContext: function(callback) {
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(ESUtils.wxUntils.system)) {
wx.invoke('getContext', {}, (res) => {
callback && callback(res)
});
}else{
jWeixin.invoke('getContext', {}, (res) => {
callback && callback(res)
});
}
},
// 选择外部联系人
selectEContact: function(callback) {
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(ESUtils.wxUntils.system)) {
wx.invoke('selectExternalContact', {
"filterType": 0, //0表示展示全部外部联系人列表,1表示仅展示未曾选择过的外部联系人。默认值为0;除了0与1,其他值非法。在企业微信2.4.22及以后版本支持该参数
}, (res) => {
if (res.err_msg == "selectExternalContact:ok") {
callback && callback(res, 1);
} else {
callback && callback(res, 0);
}
});
}else{
jWeixin.invoke('selectExternalContact', {
"filterType": 0, //0表示展示全部外部联系人列表,1表示仅展示未曾选择过的外部联系人。默认值为0;除了0与1,其他值非法。在企业微信2.4.22及以后版本支持该参数
}, (res) => {
if (res.err_msg == "selectExternalContact:ok") {
callback && callback(res, 1);
} else {
callback && callback(res, 0);
}
});
}
},
上述为一部分的API封装
三:页面的使用
做完所有的准备工作后,我们就需要进行项目的建立了 首先我们需要在页面中进行引入。
index.vue。
这个有一个非常重要的信息,我最开始 也是 这样然后再页面引入了但是我通过console 发现 当第一次进入的时候 在ios中无法识别出 agentConfig,一次偶然的时机我通过刷新一次页面后发现就能抽取出来,但是 动态引入只能引入一次,因此我决定更具这个情况进行曲线救国策略。
在index.vue中
onload(option){
var url = document.location.href;
let value = ESUtils.fn.getQueryString("eventType");
//每次进入index的我们让他自动刷新一次
if(url.indexOf("refreshed=") == -1){
var time = new Date();
window.location.href=url+"&refreshed="+time.getTime();
}
this.$nextTick(()=>{
let cropId = ESUtils.ESDB.getLoginInfo().cropId;
let userId = ESUtils.ESDB.getLoginInfo().id;
let url = window.location.href;
ESUtils.wxUntils.initJssdkAgent(res=>{
//引入并注册SDK
WWOpenData.bind(document.querySelectorAll('ww-open-data'));
ESUtils.wxUntils.getContext(result=>{ //这是判断是否 从快捷栏进入的 从而跳转指定的页面 并将入口的参数传过去
var loginInfo = ESUtils.ESDB.getLoginInfo();
if(url.indexOf("refreshed=") != -1){
if(option.eventType && option.eventType != ""){
var push = ESPush[option.eventType];
var params = '?pushEventId=' + option.eventId + "&workWX=" + result.entry;
let page = "";
if(ESUtils.ESDB.getLoginInfo().isJava == 1){
page = push.page_java;
}else{
page = push.page;
}
push && uni.navigateTo({
url: page + params
});
}
}
});
})
});
}
通过这样 我们就可以发现 在ios 和安卓中我们都可以进行兼容了 ,不会出现 wx.config 或者 wx.agnetConfig 为undefined的问题了。注意 其他的界面最好不要再调用 initJssdkAgent()方法了
如果 其他的朋友还有更好的解决方法,可以多多交流
收起阅读 »

mac环境,HBuilder X开发uni-app项目使用安卓模拟器
环境:
- mac:12.6
- cpu:intel
步骤:
- 下载并安装夜神模拟器,这是夜神模拟器官网,我安装的是 3.8.5.7。
- 按照提示安装并启动夜神模拟器,注意一定要授权。
- HBuilder X,设置-运行配置-Android模拟器端口,端口号填写62001。这是官方端口号说明](https://www.yeshen.com/faqs/H15tDZ6YW),也可以通过在终端使用
adb devices
来查看端口号。 - 运行,运行到安卓手机模拟器基座,这时应该就可以用了。
如果还是不行,检查你的/Applications/NemuPlayer.app/Contents/MacOS目录下是否有adb,hbuderX会默认找这个地址下的adb,adb目录可以在配置接口的地方配置。
说一下为什么不用mumu,我这边运行到mumu一直显示“同步手机端程序文件完成”,不能进入页面。
环境:
- mac:12.6
- cpu:intel
步骤:
- 下载并安装夜神模拟器,这是夜神模拟器官网,我安装的是 3.8.5.7。
- 按照提示安装并启动夜神模拟器,注意一定要授权。
- HBuilder X,设置-运行配置-Android模拟器端口,端口号填写62001。这是官方端口号说明](https://www.yeshen.com/faqs/H15tDZ6YW),也可以通过在终端使用
adb devices
来查看端口号。 - 运行,运行到安卓手机模拟器基座,这时应该就可以用了。
如果还是不行,检查你的/Applications/NemuPlayer.app/Contents/MacOS目录下是否有adb,hbuderX会默认找这个地址下的adb,adb目录可以在配置接口的地方配置。
说一下为什么不用mumu,我这边运行到mumu一直显示“同步手机端程序文件完成”,不能进入页面。
收起阅读 »