如何在Converse.js中显示聊天视图时编程隐藏成员列表

好的，针对你想在Converse.js里隐藏成员列表的需求，确实有几种实用的方法，不管是初始化配置还是运行时编程控制都能实现：

如果你希望所有聊天视图一开始就不显示成员列表，可以在Converse初始化时直接设置show_members配置项为false。这种方法简单直接，适合全局生效的场景：

converse.initialize({
    show_members: false,
    // 这里可以添加其他你的配置项，比如bosh_service_url等
});

如果需要在聊天视图显示的特定时机动态隐藏成员列表，比如切换到某个聊天窗口时触发，可以借助Converse的API来实现：

1. 针对当前活跃的聊天窗口 #

先获取当前激活的聊天框对象，再修改它的show_members属性，Converse会自动更新视图：

// 获取当前活跃的聊天框
const activeChatbox = converse.chatboxes.getActiveChatbox();
// 隐藏成员列表
if (activeChatbox) {
    activeChatbox.set('show_members', false);
}

2. 监听聊天视图显示事件自动隐藏 #

如果想在任何聊天视图加载完成时自动隐藏成员列表，可以监听Converse的chatBoxShow事件，在回调里执行隐藏逻辑。如果只针对多用户房间（MUC），还可以加类型判断：

converse.api.listen.on('chatBoxShow', (chatbox) => {
    // 可选：只对多用户房间生效
    if (chatbox.get('type') === 'chatroom') {
        chatbox.set('show_members', false);
    }
    // 如果要对所有聊天窗口生效，直接执行下面一行即可
    // chatbox.set('show_members', false);
});

3. 直接操作DOM（备选方案） #

如果上述API方法不适用，也可以直接定位成员列表的DOM元素进行隐藏。Converse的成员列表容器通常带有converse-members类，你可以通过JS控制它的显示：

// 隐藏成员列表
document.querySelector('.converse-members').style.display = 'none';
// 或者添加隐藏类（如果你的样式表有.hidden类的话）
document.querySelector('.converse-members').classList.add('hidden');

不过这种方法依赖DOM结构，Converse版本更新可能会改变类名，所以优先推荐API方式。

内容的提问来源于stack exchange，提问作者Sachin Choudhary