超级会员免费看
本文介绍如何在微信小程序中实现类似微信群聊的@功能输入框，讨论光标概念，提供开源组件yun-ui-micro的atinput组件，并探讨实现思路，包括使用缓存Map处理删除和光标位置，以及组件的开放性设计。
你可以直接从npm中下载组件使用： npm - yun-ui-micro 中的 atinput 组件。也可通过本文代码二次修改。
本文完整代码地址：https://github.com/1314mxc/yunUI，欢迎star！有更多组件供你使用。
展示
背景
像微信群聊、微博的输入框中输入“@”符号，能够选择人员，特殊通知某个人。
这个功能涉及一个考虑点：要不要做“@人员”区域特殊样式？
答：在小程序中很难做到。因为像 input 、textarea 中是不能插入标签的，如果要做只能通过 HTML5 的 contenteditable 属性配合 div 标签实现，使用抢到的 Range 和
订阅专栏 解锁全文
扫一扫
1437
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
