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组件:

最终效果:

相关推荐
我很苦涩的4 小时前
使用微信小程序实现多格验证码效果
微信小程序·小程序
阿里花盘4 小时前
花店微信小程序怎么做,创建一个小程序需要多少钱
微信小程序·小程序
2501_916008894 小时前
没有源码如何加密 IPA 实战流程与多工具组合落地指南
android·ios·小程序·https·uni-app·iphone·webview
LXA08096 小时前
UniApp 小程序中使用地图组件
小程序·uni-app·notepad++
bug总结6 小时前
更新原生小程序封装(新增缓存订阅)完美解决
前端·缓存·小程序
QuantumLeap丶8 小时前
《uni-app跨平台开发完全指南》- 07 - 数据绑定与事件处理
vue.js·ios·uni-app
2501_933509079 小时前
无锡制造企税惠防错指南:知了问账帮守政策红利线
大数据·人工智能·微信小程序
汤姆yu11 小时前
基于微信小程序的智慧社区娱乐服务管理平台
微信小程序·娱乐
2501_9159090612 小时前
Flutter 应用怎么加固,多工具组合的工程化实战(Flutter 加固/Dart 混淆/IPA 成品加固/Ipa Guard + CI)
android·flutter·ios·ci/cd·小程序·uni-app·iphone
千寻技术帮14 小时前
50013_基于微信小程序的校园志愿者系统
mysql·微信小程序·springboot·文档·ppt