javascript - Försöker ställa in fönsterhöjd men det ger ett fel i react.js


Jag använder useState för att få fönstrets höjd, men det ger ett körfel som säger att fönstret inte är definierat. Vet du varför

Här är koden:

let [winHeight,setWinHeight] = useState(window.innerHeight)
useEffect(() => {
          const list = []
          for (var i=0;i<datas.length;i++){
               const t = datas[i].title
               const res = handleResize(i + 2)
               list.push(<li ref={resl[i + 1]} style={{top: "20px",left: res + "px"}}><Anchor href={datas[i].link || `/${t.replace(/ /g, "_")}`}><a onClick={() => closeNav()} onMouseOver={() => setHovering(i)}>{t}</a></Anchor></li>)
          }
          setWinHeight(window.innerHeight)
          setLinks(list)
     }, [winHeight])

Svar #1

Har du försökt att lägga till window.height i useEffects beroende-array?

useEffect(() => {
      const list = []
      for (var i=0;i<datas.length;i++){
           const t = datas[i].title
           const res = handleResize(i + 2)
           list.push(<li ref={resl[i + 1]} style={{top: "20px",left: res + "px"}}><Anchor href={datas[i].link || `/${t.replace(/ /g, "_")}`}><a onClick={() => closeNav()} onMouseOver={() => setHovering(i)}>{t}</a></Anchor></li>)
      }
      setLinks(list)
 }, [window.innerHeight])

Svar #2

Prova detta:

let [winHeight,setWinHeight] = useState(0)

useEffect(()=> {
setWinHeight(window.innerHeight)
},[])

Och du behöver också importera useEffect från 'react'.

window är inte definierad eftersom komponenten inte är renderad vid den tidpunkt du försöker komma åt window-objektet.