状态值停止在UseEffect挂钩中更新-Gatsby / React

Question

状态值showMenu不在useEffect挂钩内更新。

在测试时，当第一次单击按钮并触摸屏幕以移动时，showMenu正确地控制台到true。当第二次单击该按钮（第三次，第四次，等等）并触摸屏幕以移动时，showMenu继续以true的形式出现，当它应交替显示为false时。 / p>

const [showMenu, setShowMenu] = useState(false)

useEffect(_ => {
    const listener = e => {
        e.preventDefault()
        console.log(showMenu, ' useEffect - touchmove')
    }

    showMenu
        ? document.body.addEventListener('touchmove', listener, {passive: false})
        : document.body.removeEventListener('touchmove', listener)
}, [showMenu])

return (
    <button onclick={_ => {
        console.log(!showMenu, ' button click')
        setShowMenu(!showMenu)
    }} />
)

控制台结果

Answer 1

我不知道您的意图是什么，但是您对useEffect所做的事情可能不是您所期望的。当showMenu为false时，您将删除尚未绑定的listener函数，因为在JS中每次引用都比较对象，并且listener每次{{ 1}}的变化。

showMenu更改时取消绑定监听器的典型方法是返回一个处理useEffect回调中的清理的函数。像这样：

useEffect

Answer 2

我认为body事件没有被正确删除，因为每次while Query == 'Y': Subject = input("Enter the Subject: \n> ") CatalogNbr= input("Enter the CatalogNbr: \n> ") if Subject == 'LIBS' and CatalogNbr == '150': print(f"The title of {Subject,CatalogNbr} is Introduction to Research") Query = input("\nWould you like to search for another title? (Y or N)\n> ") elif Subject == 'SDEV' and CatalogNbr == '400': print(f"The title of {Subject,CatalogNbr} is Secure Programming in the Cloud") Query = input("\nWould you like to search for another title? (Y or N)\n> ") elif Subject == 'PHIL' and CatalogNbr == '348': print(f"The title of {Subject,CatalogNbr} is Religions of the East") Query = input("\nWould you like to search for another title? (Y or N)\n> ") elif Subject == 'BEHS' and CatalogNbr == '320': print(f"The title of {Subject,CatalogNbr} is Disability Studies") Query = input("\nWould you like to search for another title? (Y or N)\n> ") elif Subject == 'PSYC' and CatalogNbr == '354': print(f"The title of {Subject,CatalogNbr} is Cross-Cultural Psychology") Query = input("\nWould you like to search for another title? (Y or N)\n> ") elif Subject == 'SPCH' and CatalogNbr == '482': print(f"The title of {Subject,CatalogNbr} is Intercultural Communication") Query = input("\nWould you like to search for another title? (Y or N)\n> ") elif Subject == 'WMST' and CatalogNbr == '200': print(f"The title of {Subject,CatalogNbr} is Introduction to Womens Studies Women and Society") Query = input("\nWould you like to search for another title? (Y or N)\n> ") elif Subject == 'HYST' and CatalogNbr == '482': print(f"The title of {Subject,CatalogNbr}is History of Japan to 1800") Query = input("\nWould you like to search for another title? (Y or N)\n> ") elif Subject == 'ASDT' and CatalogNbr == '370': print(f"The title of {Subject,CatalogNbr} is Interpreting Contemporary China") Query = input("\nWould you like to search for another title? (Y or N)\n> ") elif Subject == 'JAPN' and CatalogNbr == '333': print(f"The title of {Subject,CatalogNbr} is DJapanese Society and Culture") Query = input("\nWould you like to search for another title? (Y or N)\n> ") else: print(f"I'm sorry {Subject,CatalogNbr} is not an avalible option.") if Query == 'N': print("Thank you for using the Catalog Search!")``` 都会更改侦听器。

因此，您可以在SELECT TOP 10 GETDATE() runtime, * FROM ( SELECT query_stats.query_hash, SUM(query_stats.cpu_time) 'Total_Request_Cpu_Time_Ms', SUM(logical_reads) 'Total_Request_Logical_Reads', MIN(start_time) 'Earliest_Request_start_Time', COUNT(*) 'Number_Of_Requests', SUBSTRING(REPLACE(REPLACE(MIN(query_stats.statement_text), CHAR(10), ' '), CHAR(13), ' '), 1, 256) AS "Statement_Text" FROM ( SELECT req.*, SUBSTRING( ST.text, (req.statement_start_offset / 2) + 1, ((CASE statement_end_offset WHEN -1 THEN DATALENGTH(ST.text) ELSE req.statement_end_offset END - req.statement_start_offset ) / 2 ) + 1 ) AS statement_text FROM sys.dm_exec_requests AS req CROSS APPLY sys.dm_exec_sql_text(req.sql_handle) AS ST ) AS query_stats GROUP BY query_hash ) AS t ORDER BY Total_Request_Cpu_Time_Ms DESC; 中返回一个函数以清除前一个useEffect。

useEffect

您还可以阅读cleaning-up-an-effect了解更多信息