在 React 中设置两个状态变量 onClick

Question

我试图在用户单击图像时设置两个状态变量，我的浏览器认为我正在调用第二个函数，我该如何分配这两个变量？我知道我不能使用 && 但我不知道如何正确使用它，如果这是一个愚蠢的问题，我很抱歉。

<div className="img-wrap" key={doc.id}
                    onClick={() => (
                        setSelectedImg(doc.url) &&
                        setSelectedArtName(doc.artName))}
                >   
                    <img src={doc.url} alt={doc.artName} />
                    
                </div>

Answer 1

一个没有显式 return 语句的函数 returns undefined（一个像你的 setState 的 setter 函数）。

在 && 中，仅当第一个条件为时才检查第二个条件。否则直接false被returned。由于第一个函数 returns undefined（一个虚假值），第二个 setState 不会运行.

我想你可以不用 &&:

<div className="img-wrap" key={doc.id}
                    onClick={() => {
                        setSelectedImg(doc.url);
          setSelectedArtName(doc.artName)}}
                >   
                    <img src={doc.url} alt={doc.artName} />
                    
                </div>

在 React 中设置两个状态变量 onClick

Setting two state variable onClick in React

javascript

onclick

reactjs

react-native

react-hooks