Reactjs useEffect在组件加载时触发，而不是在状态更改时触发，正如我设置的那样

当我更改

useState

时，我试图触发我的useffect，但是，当组件加载时它只触发一次（我根本不想要），代码有什么问题

const [value, setValue] = useState('initial');
    useEffect(()=>{
        let url = "https://hacker-news.firebaseio.com/v0/topstories.json";
        let count = 30;
        axios({
            method: 'post',
            url: '/api/grabIt',
            data: {
                url: url,
                count: count
            }
        })
            .then(function (res) {
                console.log(res.data.response)
            })
            .catch(function (error) {
                console.log(error)
            });
    },[value]);
    
    return (
        <div className={styles.displayType}>
            <ButtonContainer/>
            <Button buttonColor={!!isDarkMode}
                    onClick={ () => setValue('triggered')}
            >FETCH</Button>
        </div>
    )

const[value，setValue]=useState（'initial'）；
useffect（（）=>{
让url=”https://hacker-news.firebaseio.com/v0/topstories.json";
让计数=30；
axios({
方法：“post”，
url:“/api/grabIt”，
数据：{
url:url，
计数：计数
}
})
.然后（功能（res）{
console.log（res.data.response）
})
.catch（函数（错误）{
console.log（错误）
});
}，[价值]；
返回(
setValue（'triggered'）}
>取回
)

对于你想要实现的目标，你不需要效果。 我将从如下函数处理提取：

// simplified the example
const [value, setValue] = useState("initial");

const handleFetch = () => {
  setValue("triggered");
};

return (
  <div>
    <button onClick={handleFetch}>{value}</button>
  </div>
);

//简化了示例
const[value，setValue]=使用状态（“初始”）；
常量handleFetch=（）=>{
设定值（“触发”）；
};
返回(
{value}
);

在函数useffect中，您已经设置了依赖项，包括

值

。这意味着只有在

value

更改时才调用。设置值后，

触发

。它永远不会更改，因为原语值字符串“已触发”==“已触发”

您可以使用布尔值触发单击。例如：

const [value, setValue] = useState(false);
...
<Button buttonColor={!!isDarkMode}
        onClick={ () => setValue(!value)}

const[value，setValue]=useState（false）；
...
setValue（！value）}

如果您不希望在呈现组件时触发useEffect，而只希望在单击按钮时触发，那么我不明白您为什么要将其放在useEffect中，而不仅仅是创建一个简单的函数来处理请求。