@@ -192,28 +192,32 @@ export default function Home() {
192
192
} ;
193
193
194
194
useEffect ( ( ) => {
195
- const hoverElement = document . querySelector ( "h1" ) ;
196
- const originalColor = "var(--color-text)" ;
195
+ useEffect ( ( ) => {
196
+ const hoverElement = document . querySelector ( "h1" ) ;
197
+ const originalColor = "var(--color-text)" ;
197
198
198
- hoverElement . addEventListener ( "mouseenter" , function ( ) {
199
- const randomColor = getRandomColor ( ) ;
200
- hoverElement . style . color = randomColor ;
201
- } ) ;
202
-
203
- hoverElement . addEventListener ( "mouseleave" , function ( ) {
204
- hoverElement . style . color = originalColor ;
205
- } ) ;
206
-
207
- return ( ) => {
208
- hoverElement . removeEventListener ( "mouseenter" , function ( ) {
199
+ if ( hoverElement ) {
200
+ hoverElement . addEventListener ( "mouseenter" , function ( ) {
209
201
const randomColor = getRandomColor ( ) ;
210
202
hoverElement . style . color = randomColor ;
211
203
} ) ;
212
204
213
- hoverElement . removeEventListener ( "mouseleave" , function ( ) {
205
+ hoverElement . addEventListener ( "mouseleave" , function ( ) {
214
206
hoverElement . style . color = originalColor ;
215
207
} ) ;
216
- } ;
208
+
209
+ return ( ) => {
210
+ hoverElement . removeEventListener ( "mouseenter" , function ( ) {
211
+ const randomColor = getRandomColor ( ) ;
212
+ hoverElement . style . color = randomColor ;
213
+ } ) ;
214
+
215
+ hoverElement . removeEventListener ( "mouseleave" , function ( ) {
216
+ hoverElement . style . color = originalColor ;
217
+ } ) ;
218
+ } ;
219
+ }
220
+ } , [ ] ) ;
217
221
} , [ ] ) ;
218
222
219
223
function getRandomColor ( ) {
0 commit comments