Talk JS ошибка с User.id: [TalkJS] Пользователь: обязательное поле "id" не задано или не является строкой или числом

Question

Создание приложения чата React с помощью Talk JS. Ниже моя страница "Моя сеть" с большинством логи c.

У меня есть форма входа с именем, адресом электронной почты, описанием и генерацией случайного идентификатора. Я храню эту информацию в локальном хранилище и получаю в сети. js. Когда я нажимаю на пользователя, чтобы начать чат, я получаю следующую ошибку в консоли:

index.js:1 Error: [TalkJS] User: required field "id" is not given or not a string or a number.

Похоже, что это происходит в этой строке кода:

    const me = new Talk.User({currentUser});
    const other = new Talk.User(user);

    console.log(me);
    console.log(other);

I'm читать это как создаваемая новая переменная (me или other) не принимает поле id из currentUser или user?

Сеть. js

import React from 'react';
import { dummyUsers } from './Users.js';
import Talk from 'talkjs';

class Network extends React.Component{

constructor(props){
    super(props);

    let currentUser;
    const currentStoredUser = localStorage.getItem("currentStoredUser");
    if (currentStoredUser) {
        currentUser = JSON.parse(currentStoredUser)
    }

    this.state = {
        currentUser

    }
}

handleClick(userId) {

    /* Get both users */
    const { currentUser } = this.state;
    const user = dummyUsers.find(user => user.id === userId);

    console.log(currentUser);
    console.log(user);

    /* Create talk session */
    Talk.ready.then(() => {
        const me = new Talk.User({currentUser});
        const other = new Talk.User(user);

        console.log(me);
        console.log(other);

        if(window.talkSession) {
            window.talkSession = new Talk.Session({
                appId: "twBRxQzL",
                me: me
            });
        }

        const conversationId = Talk.oneOnOneId(me, other);
        const conversation = window.talkSession.getOrCreateConversation(conversationId);

        conversation.setParticipant(me);
        conversation.setParticipant(other);

        this.chatbox = window.talkSession.createChatBox(conversation);
        this.chatbox.mount(this.container);

        console.log(me);
        console.log(other);
    })
    .catch(e => console.error(e));


}

render(){

    const { currentUser } = this.state;

    return(
        <div>
        <div className="list-group w-25">
            {dummyUsers.map(user => {
                return(
                    <button onClick={(userId) => this.handleClick(user.id)} className="list-group-item list-group-item-action flex-column align-items-start ">
                        <div className="d-flex w-100 justify-content-between">
                        <img src={user.photoUrl} alt="User" height="42" width ="42"/>
                            <h5 className="mb-1">{user.name}</h5>                                
                        </div>
                        <p className="mb-1">{user.email}</p>
                        <p className="mb-1">{user.description}</p>
                    </button>
                )
            })}
        </div> 
        <div className="chatbox-container" ref={c => this.container = c}>
            <div id="talkjs-container" style={{height: "300px"}}><i></i></div>
        </div>
        </div>
    )
}
}
export default Network;

Answer 1

Код ниже работает:

        Talk.ready.then(() => {
        const me = new Talk.User({
            id: currentUser.id,
            name: currentUser.name,
            email: currentUser.email,
            description: currentUser.description,
            photoUrl: currentUser.photoUrl
        });
        const other = new Talk.User(user);

Кто-нибудь захочет объяснить, зачем это нужно, и я не могу просто передать Talk.User({currentUser})?