你好，我是React的新手。我有一个显示列表用户的react组件。数据来自对象数组。当我获取新的数据，改变了对象的属性，组件没有重新渲染。如何解决这个问题？
下面是我的代码：
homepage.js

...
const [users, setUsers] = useState([])

async function connWS() {
ws.onmessage = async function(message) {
  var parsedMessage = JSON.parse(message.data);
  console.info('Received message: ' + message.data);
        
  switch (parsedMessage.id) {
   case 'updateListUser':
   setUsers(parsedMessage.users);
  break;
}

useEffect(() => {
  async function init() {
    await connWS();
  }
  init();
}, []);

    return (
        <Layout
            isVideoCall={false}
            rightSection={
            <Users data={users} />
        </Layout>
    );

字符串
Users.js

const Users = ({data}) => {
return (
        <div className={styled.users}>
            {data.map((user) => (
                <div className={styled.userItem}>
                    {user.imageUrl ? (
                        <img src={""} alt={user.name} />
                    ) : (
                        <span style={{ backgroundColor: `#13c2c2` }}>
                            {user.shortName}
                        </span>
                    )}
                    <p>{user.name}</p>
                    {user.state ? (
                        user.state === 'REGISTERED' || 'registered' ? (
                            <p style={{ color: `#13c2c2` }}>Online</p>
                        ) : (
                            <p style={{ color: `#f5222d` }}>Offline</p>
                        )
                    ) : (
                        <p style={{ color: `#f5222d` }}>Offline</p>
                    )}
                    
                    <div className={styled.overlay}>
                        <Button
                            className={styled.callBtn}
                            type="dashed"
                            size="large"
                            icon={
                                <Icon name="call" width={24} height={24} />
                            }
                            ghost
                            onClick={() => onClickCall(user.name)}
                        >
                            Call
                        </Button>
                    </div>
                </div>
            ))}
        </div>
    );
};
}

型
下面是用户数据的示例。

const users = [
        {
            name: 'Josh',
            state: 'registered'
        },
        {
            name: 'Mike',
            state: 'in_call'
        }
    ]

型
我试图更新状态用户列表中，他们在线/离线使用WebSocket实时更新.当我从服务器获取数据时，只改变了state的属性，但组件没有重新渲染。
我试图解决使用不同的refference内存，创建一个新的数组对象使用新的数据，但我仍然没有工作。