chatUI实现实时预览

背景：在项目中涉及到机器人部署模块，chatUI 预览页面是通过iframe嵌入，父子页面通过postMessage通信，当子页面监听到数据变化，更新页面配置。

官网提供了setConfig方法更新config，从而重新渲染页面：

// 更新 config
bot.setConfig(configKey, configValue);

然鹅...,他只针对部分配置生效（navbar.title、placeholder），怎么办?项目还得继续进行呀，于是通过各种摸索实现了，其他配置的实时更新：

// 针对机器人头像 （为string类型的头像地址）
// 第一步：获取消息列表
 const list = bot.appRef.current.getMessageList();
// 第二步：遍历消息，更换头像
list.forEach((item: { position: string; user: { avatar: string } }) => {
    if (item.position === "left") {
        item.user = { avatar: '.....' };
     }
 });

针对机器人欢迎语、预置回复按钮使用

bot.appRef.current.getCtx().appendMessage(...)
bot.appRef.current.resetMessageList()

方法更新视图