web-dev-qa-db-ja.com

反応フックを使用して状態配列を設定する方法

前もって感謝します。以下のような状態配列があります。

状態の配列に項目を追加する必要があります。状態の変更を行う必要がないことに気づきました。 prevStateで状態を設定する方法.

const [messages, setMessages] = React.useState(
        [
            {
                _id: 12,
                createdAt: new Date(),
                text: 'All good',
                user: {
                    _id: 1,
                    name: 'Sian Pol',
                }
            },
            {
                _id: 21,
                createdAt: "2019-11-10 22:21",
                text: 'Hello user',
                user: {
                    _id: 2,
                    name: 'User New'
                }
            }]
    )

この状態配列を追加するためにセット状態を呼び出す方法.

このようなもの？

setMessages(previousState => ({...stat

誰かが上記の行コードを取得するのを手伝ってくれる？.

reactjsreact-nativereact-hookssetstate
2
Ankit Jayaprakash

リストの最後に新しい要素を挿入するには

const addMessage = (newMessage) => setMessages(state => [...state, newMessage])

リストの最初に新しい要素を挿入するには

const addMessage = (newMessage) => setMessages(state => [newMessage, ...state])
5
tolotra

PrevStateを実際に使用する必要はありません。次のようにできます。

setMessages([...messages, newMessage])
1
Konstantin

状態は配列なので、以前の状態を新しい配列に展開し、[...prevState, newMessage]を使用して新しいメッセージを追加する必要があります

{}はコードブロックなので、実行しようとしているオブジェクトを返す場合は()内にラップする必要があるため、実行しようとしているのはオブジェクトを返すことです。

setMessages(prevState => [...prevState, newMessage])
1
Asaf Aviv

setMessages（prevState => [... prevState、newMessage]）

0
Ankit Jayaprakash

読みやすくし、おそらくあなたの状態を制御するために、私はこのようにします：

実際の状態のコピーを保持する変数を作成します。

stateが配列で、項目を追加する必要がある場合

let newState = [...messages];
newState.Push(1);
setMessages(newState);

stateがオブジェクトであり、そのプロパティを更新する必要がある場合

let newState = Object.assign({}, message);
newState.name = 'Michael Scott';
setMessages(newState);
0
Astrit Spanca