Question

我正在学习反应，在此过程中，我试图在单个useEffect挂钩内设置多个状态变量。我只是想知道，如果我的方法是设置多个状态变量的正确方法。如果有更好的方法，请查看并提出建议。

    import React, { useState, useEffect } from 'react';
    import axios from 'axios';

    const App = () => {
        const reqUrl = 'https://hn.algolia.com/api/v1/search?query=redux'
        const initialStateValue = [{ id: 0, value: ' --- Select A State --- ' }];

        const [initialJsonData, setInitialJsonData] = useState({ hits: [] });
        const [tagTypes, setTagTypes] = useState([]);
        const [stateSelected, setStateSelected] = useState(initialStateValue[0].value);


        useEffect(() => {
            axios(reqUrl).then(result => {
                const tagTypeLocal = { ...result.data.hits[0] }
                setTagTypes(tagTypeLocal._tags) --> setting the state variable tagTypes
                console.log(tagTypeLocal._tags)
                setInitialJsonData(result.data) --> setting the state variable initialJsonData
            })

        }, [])

Answer 1

是的，这是可以接受的实现，用于使用useEffect钩子更新多个状态项。

要解决您的问题的评论之一，最好使用多个状态变量，因为根据链接的CodeSandbox的建议，状态变量可能会在不同的时间进行更新。实际上，在React docs.

中推荐了这种方法

React-设置多个状态变量的API调用（更好的选择）

1 个答案: