动态房间 Flask Socket.IO答案

【问题标题】：Dynamic rooms Flask Socket.IO动态房间 Flask Socket.IO
【发布时间】：2020-06-09 23:01:31
【问题描述】：

我想知道为什么我不能在我的输入中单击“发送”时动态地将房间添加到我的房间列表中:( 这是我的代码：

烧瓶：

@socketio.on('new_room')
def new_room(data):
room = data["new_room_name"]
print(room)
ROOMS.append(data["new_room_name"])
join_room(data['new_room_name'])
emit('new room received', data, room, broadcast=True)

JS：

// send new room to the server
document.querySelector('#send_newRoom').onclick = () => {
    socket.emit('new_room', {'new_room_name': document.querySelector('#new_room').value}); // This is what you SEND to the server
}

socket.on('new room received', room => { //This is what you RECEIVE from the server
    console.log('room');
    let createdRoom = room.new_room_name

    const li = document.createElement('li');
    li.innerHTML = createdRoom
    li.setAttribute('class','select-room');

    document.querySelector('#rooms').append(li);
    });

HTML：

<div class="col-lg-4 col-md-4" style="background: lightblue;">
        <div>
            <input type="text" id="new_room" placeholder="Type here..." autocomplete="off"> 
            <button type="button" id="send_newRoom">SEND</button>
        </div>
        <H3>ROOMS</H3>
        <ul id="rooms">
            {% for room in rooms %}
                <li class="select-room">{{ room|title }}</li>
            {% endfor %}
        </ul>
    </div>

这就是我的应用的外观（没有设计）： enter image description here

【问题讨论】：

标签： python flask socket.io

【解决方案1】：

只需将python函数中的最后一行更改为：

emit('new room received', data, broadcast=True)

https://flask-socketio.readthedocs.io/en/latest/

【讨论】：