uniapp:微信小程序文本长按无法出现复制菜单

一、问题描述

在集成腾讯TUI后,为了能让聊天文本可以复制,对消息组件的样式进行修改,主要是移除下面的user-select属性限制:

复制代码
  user-select: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;

在Android设备上可以正常显示长按的复制菜单,但在IOS上无法正常显示。

二、解决方案

在微信开发文档中找到:

同时在uniapp上也找到相关文档:

但实际在uniapp中使用span标签编译出来的是label标签:

因此,将span改成text即可:

html 复制代码
<div>
	<text
	  class="text"
		:user-select="true"
	>{{ item.text }}</text>
</div>

经过编译后确认是text组件:

最终效果:

相关推荐
RuoyiOffice13 小时前
企业请假销假系统设计实战:一张表、一套流程、两段生命周期——BPM节点驱动的表单变形术
java·spring·uni-app·vue·产品运营·ruoyi·anti-design-vue
KongHen0214 小时前
uniapp-x实现自定义tabbar
前端·javascript·uni-app·unix
哈罗哈皮16 小时前
trea也很强,我撸一个给你看(附教程)
前端·人工智能·微信小程序
0xDevNull16 小时前
基于Java的小程序地理围栏实现原理
java·小程序
Kingexpand_com17 小时前
实用技巧:小程序积分体系的功能拆解与高效利用指南
小程序·仓库管理·库存管理·小程序定制开发
毕设源码-赖学姐17 小时前
【开题答辩全过程】以 居家养老服务微信小程序设计与实现为例,包含答辩的问题和答案
微信小程序·小程序
RuoyiOffice17 小时前
SpringBoot+Vue3+Uniapp实现PC+APP双端考勤打卡设计:GPS围栏/内网双模打卡、节假日方案、定时预生成——附数据结构和核心源码讲解
java·spring·小程序·uni-app·vue·产品运营·ruoyi
杰建云16720 小时前
企业内部是否需要技术团队做小程序
小程序·小程序制作
2501_9159214320 小时前
2026 iOS 上架新趋势 iOS 发布流程模块化
android·ios·小程序·https·uni-app·iphone·webview
码视野20 小时前
#Cursor加Specs编程,3小时上线一个有管理后台和移动端的检举举报全流程平台(完全开源)
spring boot·小程序·ai编程