SuperAPI AI 工具集

cometchat-native-customization

前端与建站

查看项目

更新于 10-15 20:14

技能介绍

用途:在不修改 React Native UI Kit 源码的前提下,改变 CometChat 组件的行为或外观。采用四级模型,从成本最低到最深:Tier 1 props(约 95% 需求在此解决)、Tier 2 RequestBuilder(过滤加载的数据)、Tier 3 格式化器与消息模板(改变文本/消息渲染)、Tier 4 DataSource 装饰器与事件(最后手段)。应先尝试 Tier 1,只有该层无法满足时才升级。使用前需先阅读 cometchat-native-components,它是 prop 名称、插槽视图和事件监听器名称的权威目录。

主要能力:Tier 1 通过 hide*/可见性标志关闭功能,通过 PascalCase 插槽 prop(如 TitleView、SubtitleView、LeadingView)替换组件局部 UI,通过嵌套 style 对象做单实例样式覆盖,并可用 useTheme() 让自定义视图匹配主题。Tier 2 使用 ConversationsRequestBuilder、UsersRequestBuilder、GroupsRequestBuilder、MessagesRequestBuilder、GroupMembersRequestBuilder 等链式构建器过滤数据,避免在渲染中后置过滤。Tier 3a 继承 CometChatTextFormatter 处理行内文本模式(话题标签、URL、提及、表情短码),需同时传给 CometChatMessageList 和 CometChatMessageComposer。Tier 3b 使用从 UI Kit 导出的 CometChatMessageTemplate 渲染自定义消息类型,注册时必须与 getAllMessageTemplates(theme) 的默认模板合并,不能替换。Tier 3c 可覆盖内置类型的气泡,Tier 3d 通过 CometChatMessageOption 对象字面量追加长按菜单项。Tier 4 使用 CometChatUIEventHandler 监听事件或 DataSourceDecorator 重写数据流。

使用方式:安装文档 MCP 可执行 claude mcp add --transport http cometchat-docs https://www.cometchat.com/docs/mcp,或直接访问该 URL。官方文档见 https://www.cometchat.com/docs/ui-kit/react-native/overview。

限制:需先掌握组件目录;模板注册若只传自定义模板会替换内置模板导致普通消息空白;RN 套件中不存在 CometChatActionsIcon/CometChatActionsView,也不存在 Chat SDK 的 CometChat.MessageTemplate。具体收费、价格与平台支持信息暂未提供。