最近在开发uniapp时使用uni-datetime-picker组件，需要在代码中获取组件实例进行调用组件的方法，在h5中通过$refs获取实例后便可直接调用方法.clear直接达成目的，但是在小程序中通过.selectComponent后却一直报错typeError: picker.clear is not a function

在网上查了半天也没人能说清楚这个问题后面在小程序调试中发现

在uniapp中.$refs和.selectComponent返回的结果和格式都不一样，当在小程序中需要获取组件实例时应该再加上$vm获取组件的方法实例 这样就可以直接.clear出方法了代码如下

const picker = this.getComponentInstance(this, '#report_picker');  
            if (picker) {  
              console.log(picker);  
              picker.clear(); // 调用clear方法清除选择状态  
 }

getComponentInstance(context, selector) {  
        const systemInfo = uni.getSystemInfoSync();  

        // 判断是否为小程序环境  
        if (systemInfo.uniPlatform === 'mp-weixin' || systemInfo.uniPlatform === 'mp-alipay' || systemInfo.uniPlatform === 'mp-baidu' || systemInfo.uniPlatform === 'mp-qq') {  
          // 小程序环境下使用 selectComponent  
          return context.selectComponent(selector).$vm;  
        } else {  
          // 其他平台（H5、App）使用 $refs  
          return context.$refs[selector];  
        }  
      }

如图，进行get请求时因为不带参数，所以正常使用。

尊敬的uniCloud开发者，您好！

uniCloud腾讯云服务空间于2024年12月升级了相关SDK，此次升级影响2024年12月10日后新创建的腾讯云空间，如果您在调试时碰到access token disabled for ANONYMOUS login相关错误，请升级HBuilderX到4.41 alpha版，感谢您的理解与支持。

2024年12月16日补充

部分开发者反馈升级到HBuilderX 4.41后仍有问题，请确认项目vue版本是否为vue2，针对这种情况可使用手动升级的临时方案来处理：

• 下载附件中的index.js.zip文件，解压后可以拿到index.js文件
• 在HBuilderX的安装目录下找到plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/uni-cloud/dist/目录，将上述index.js拷贝到该目录替换原文件
• 重启HBuilderX后重新运行及编译打包

很快会发布4.42版本修复vue2下腾讯云新创建空间的问题。

2024年12月19日补充

HBuilderX4.42 alpha版本已经发布，下载该版本无需手动替换HBuilderX文件。

Q&A

Q：小程序发行后无法正常运行
A：新版腾讯云服务空间的request合法域名有新增，除了之前的tcb-api.tencentcloudapi.com之外，还需要新增{spaceId}.ap-shanghai.tcb-api.tencentcloudapi.com域名（{spaceId}替换为腾讯云的服务空间Id）

Q：抖音小程序报错Unauthenticated access is denied
A：报错的网络请求header中携带了头条的referer，也就是前端发起请求跨域了，需要在服务空间添加跨域域名，默认是tmaservice.developer.toutiao.com

Q：快手小程序报错Unauthenticated access is denied
A：报错的网络请求header中携带了头条的referer，也就是前端发起请求跨域了，需要在服务空间添加跨域域名，默认是miniapi.ksapisrv.com

Q: uni-app cli 项目升级HBuilderX后依然报错
A: cli 项目升级完HBuilderX之后还需要手动升级uni-app依赖，升级参考文档

参考文档：小程序中使用uniCloud

我的项目运行到h5和小程序上，运行时什么错误都没有报。在h5上页面看着都是正常的，但是在小程序开发者工具上一直报错，显示css文件中有@include。本来我以为是cli的问题，但是编译不报错无法下手。

在论坛搜了一下，发现有个评论中写着检查lang="scss"。我检查了一下，发现是scss文件从 app.vue 中的 style 导入的，但是 style没有写lang="scss"。加上lang="scss"之后，问题解决了。

使用uniapp打包需要ios证书，正式上架的时候还需要提供各种尺寸的设备的APP截图，还需要使用xcode等工具上传ipa文件上传。

这些都需要使用mac电脑、ios设备去完成。

假如我们只有windows电脑，也没有这么多ios设备去截图。

我们可以使用香蕉云编来生成证书，然后上架的时候使用香蕉云编去生成app截图和上传ipa到app store

https://www.yunedit.com/

本地无法预览：参考链接 https://blog.csdn.net/qq2468103252/article/details/127490674
dist打包产物中对比一下就能看到，抖音小程序比微信小程序少了一个 sourcemap 文件夹

到对应的开发者工具里面搜索 sourcemap，微信小程序的产物中 sourcemap 是引用了独立 sourcemap 文件夹中的文件，而字节小程序的产物中，sourcemap 就是base64编码后内联形式存在产物文件中了。

这就能解释得通了，为什么抖音的包体积大这么多，那接下来就是想办法，如何才能跟微信小程序一样单独生成一份 sourcemap 文件夹，官网也找不到相关资料，只能看 uni-build 的源码了，参考链接：https://www.cnblogs.com/MrSi/p/13570546.html
应该就是这两份关键文件：仅当打包到微信平台时，才会在 '../.sourcemap/' + process.env.UNI_PLATFORM + '/[name].js.map' 这个相对路径下生成 sourcemap 文件，巨坑！暂时没找到原因，为什么仅针对微信单独生成 sourcemap文件夹

那依葫芦画瓢，在 vue.config.js 中添加这个 sourcemap 插件即可

现在包体积已经正常了，缩小了3倍，终于可以正常预览了

运行到鸿蒙模拟器报HBuilder X 运行设备不兼容鸿蒙模拟器目前只能在arm64平台运行

我们非常高兴地宣布，wot-design-uni 组件库的最新版本 1.5.0 于 2024 年 12 月 9 日正式发布！这一版本不仅引入了许多令人期待的新功能，还进行了文档更新和多个 Bug 修复，进一步提升了用户体验和组件的灵活性。

GitHub Star 数突破 10000

令人振奋的是，wot-design-uni 在 GitHub 上的 Star 数量已经超过了 10000！这一里程碑的达成，离不开每一位用户的支持与反馈。我们深感荣幸，并将继续努力，为大家提供更优质的组件。

✨ 新功能

1. Divider 分割线功能优化：支持虚线、垂直等多种样式，增强了设计灵活性。
2. Calendar 组件优化：改进了选中样式和滚动位置处理，并支持屏蔽内置 cell，提升了用户体验。
3. Curtain 幕帘新增功能：新增 close 插槽和自定义关闭插槽样式类，提供更多自定义选项。
4. DropMenuItem：增加自定义 Popup 样式参数，增强了菜单的灵活性。
5. Input 和 Textarea 支持 inputmode：在 APP-VUE 和 H5 端提供更好的输入体验。
6. MessageBox 新增 ButtonProps 属性：允许用户自定义确认和取消按钮的样式，增强了交互性。
7. Radio 组件：添加了 icon-placement 属性，用于控制图标方向。
8. Segmented 组件：提供了 updateActiveStyle 方法，允许用户设置激活样式。
9. Table 组件：支持设置不固定表头，提升了表格的使用灵活性。
10. Upload 组件：新增文件重传功能，提升了文件上传的便利性。

✏️ 文档更新

我们对文档进行了全面的优化，增加了内容的可用宽度，并支持收起演示 demo。此外，新增了关于 MessageBox 自定义按钮样式和 Sass 的介绍，帮助用户更好地理解和使用组件。

Bug 修复

在 1.5.0 版本中，我们针对多个关键问题进行了修复，包括：

• Button 按钮：解决了设置为 block 时无效的问题。
• Cell 组件：修复了 label 过长时影响页面结构的情况。
• Collapse 组件：确保在数据变化时折叠面板状态能够正确更新。
• GridItem：修复了徽标属性类型标注错误的问题。
• Progress 组件：解决了无法设置进度为 0 的问题。
• Swiper：修复了在支付宝小程序平台点击事件无效的问题。
• Tab 组件：修复了未渲染项高度影响整体高度的问题。
• 其他多个组件的 Bug 修复，确保了更稳定的使用体验。

结语

感谢大家对 wot-design-uni 的支持与关注！我们将继续倾听用户的声音，致力于不断改进和完善我们的组件库。期待在未来的版本中为大家带来更多惊喜和功能！如需了解更多详情，请访问我们的 GitHub 页面或者插件市场地址。

不同云服务空间(阿里云，支付宝云等)存在差异，详细流程加微信 pce105 ,一对一讲解，远程协助部署调试

厂家提供的安卓原生的sdk，用来连接硬件的蓝牙，拿硬件的数据，需要做成uniapp的插件在uinapp使用，价格看具体难度，能做的麻烦留一下联系方式

自研uniapp+vue3+pinia2多端酒店订房管理系统Uni-WeTrip(h5+小程序+App端)

uniapp-vue3-wetrip原创基于vite5+uniapp+pinia2+uni-ui等技术开发的仿去哪儿/携程预约酒店客房app系统。实现首页酒店展示、预订搜索、列表/详情、订单、聊天消息、我的等模块。支持编译H5+小程序+App端。

uniapp+vue3+pinia2+uvui跨多端酒店预订app系统

技术栈

• 跨端框架：Uniapp + Vue3
• 构建工具：Vite5
• 状态管理：Pinia2
• UI组件库：uni-ui + uv-ui
• 缓存技术：pinia-plugin-unistorage

功能性

• 开发工具：HbuilderX 4.36
• 跨平台兼容性：支持H5、小程序和App端，确保在不同设备上的无缝体验。
• 实时消息聊天：内置的消息聊天功能模块，增强用户间的沟通效率。
• 自定义组件：提供uv3-navbar标题栏和uv3-tabbar菜单栏等自定义组件，方便开发者根据需求进行调整。
• 缓存机制：利用pinia-plugin-unistorage实现数据缓存，提高应用性能。

项目结构

uni-vue3trip布局模板

<script setup>  
    // #ifdef MP-WEIXIN  
    defineOptions({  
        /**  
         * 解决小程序class、id穿透问题  
         * manifest.json中配置mergeVirtualHostAttributes: true, 在微信小程序平台不生效，组件外部传入的class没有挂到组件根节点上，在组件中增加options: { virtualHost: true }  
         * https://github.com/dcloudio/uni-ui/issues/753  
         */  
        options: { virtualHost: true }  
    })  
    // #endif  
    const props = defineProps({  
        // 是否显示自定义tabbar  
        showTabBar: { type: [Boolean, String], default: false },  
    })  
</script>  

<template>  
    <view class="uv3__container flexbox flex-col flex1">  
        <!-- 顶部插槽 -->  
        <slot name="header" />  

        <!-- 内容区 -->  
        <view class="uv3__scrollview flex1">  
            <slot />  
        </view>  

        <!-- 底部插槽 -->  
        <slot name="footer" />  

        <!-- tabbar栏 -->  
        <uv3-tabbar :show="showTabBar" transparent zIndex="99" />  
    </view>  
</template>

uni-app+vue3自定义导航条/菜单栏

const props = defineProps({  
    // 当前选中项  
    current: { type: [Number, String] },  
    // 背景色  
    bgcolor: { type: String, default: '#fff' },  
    // 颜色  
    color: { type: String, default: '#333' },  
    // 激活颜色  
    activeColor: { type: String, default: '#f90' },  
    // 是否固定  
    fixed: { type: [Boolean, String], default: false },  
    // 是否背景透明  
    transparent: { type: [Boolean, String], default: false },  
    // 是否中间凸起按钮  
    dock: { type: [Boolean, String], default: true },  
    // 设置层级  
    zIndex: { type: [Number, String], default: '2024' },  
    // 自定义iconfont字体图标库前缀  
    customPrefix: { type: String, default: 'uv3trip-icon' },  
    // 自定义样式  
    customStyle: String,  
    // 是否显示  
    show: { type: Boolean, default: true },  
    // tab选项  
    tabs: {  
        type: Array,  
        default: () => []  
    }  
})

uniapp预订功能

<!-- 日历 -->  
<uv3-popup  
    v-model="isVisibleCalendar"  
    title="选择日期"  
    position="bottom"  
    round  
    xclose  
    xposition="left"  
    :customStyle="{'overflow': 'hidden'}"  
    @open="showCalendar=true"  
    @close="showCalendar=false"  
>  
    <uv-calendars  
        v-if="showCalendar"  
        ref="calendarRef"  
        mode="range"  
        insert  
        color="#ffaa00"  
        :startDate="startDate"  
        :endDate="endDate"  
        :date="rangeDate"  
        :selected="dingDate"  
        title="选择日期"  
        start-text="入住"  
        end-text="离店"  
        @change="handleCalendarChange"  
    />  
</uv3-popup>

uniapp+vue3聊天模块

之前有开发一款uniapp+vue3聊天app实例，就不作过多的介绍，如果感兴趣可以去看看下面这篇文章。
https://www.cnblogs.com/xiaoyan2017/p/18165578

过往跨平台实战项目

HarmonyOS-Chat聊天室|纯血鸿蒙Next5 api12聊天app|ArkUI仿微信

tauri2.0-admin桌面端后台系统|Tauri2+Vite5+ElementPlus管理后台EXE程序

Electron32-ViteOS桌面版os系统|vue3+electron+arco客户端OS管理模板

electron31+vite5+element-plus桌面端聊天EXE

flutter3+dart3+getx跨端仿抖音App短视频直播实战

作者：xiaoyan2017
链接： https://www.cnblogs.com/xiaoyan2017
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

worker插件地址

部分还不知到怎么在子线程中调用uni相关的api的，这里写一个简单的示例。

子线程中

postMessage({  
type:'showToast',  
param:'弹窗'  
});

主线程接收参数，调用uni相关api

this.worker.message = (e) => {  
const {type,param} = e;  
 uni[type]({  
content:param  
})  
}