- Edit src/App.tsx and save to test HMR
-
- Click on the Vite and React logos to learn more -
- - ) -} - -export default App +import { Suspense } from 'react'; +import { UserList, UserSkeleton } from './examples/lecture_5/UserList'; +import { fetchUsers, fetchPosts } from './examples/lecture_5/lib'; +import { PostList, PostSkeleton } from './examples/lecture_5/PostList'; +import { ErrorBoundary } from './examples/lecture_5/ErrorBoundary'; +import { ErrorFallback } from './examples/lecture_5/ErrorFallback'; + +export default function App() { + return ( +{dropZoneActive ? 'Release to drop' : 'Drag items here'}
+Item being dragged: {draggedItem}
} +X: {x}
+Y: {y}
+Right click on the div below to see the difference
++ This is the content of the second accordion +
+I am Tab 1
+I am Tab 2
+I am Tab 3
++ Lorem ipsum dolor sit amet consectetur adipisicing elit. + Quisquam, quos. +
+ +I am Tab 4
+Beta feature is disabled
+ } +Count: {count}
+Count: {count}
+Count: {count2}
+Loading...
} + {error &&Error: {error}
} +Users
+ {users && ( +Loading...
} + {error &&Error: {error}
} +Posts
+ {posts && ( +{user.name}
+{user.email}
+Name: {user.name}
+Email: {user.email}
+Name: {user.name}
+Email: {user.email}
+ +{project.description}
+Deadline: {new Date(project.deadline).toDateString()}
+Status: {status}
+ +Loading...
+ )} + + {/* Team Members */} +Loading...
+ )} +{project.description}
+Deadline: {new Date(project.deadline).toDateString()}
+Status: {status}
+Loading...
; + if (error) returnError: {error}
; + + returnNo items to display
; + } + + if (!render) { + return ( +Post Title: {data}
++ Last Updated: {lastFetched?.toLocaleTimeString()} +
+Count: {count}
+Loading...
} + {error &&Error: {error}
} + +Loading...
} + {error &&Error: {error}
} + +Loading...
} + {error &&Error: {error.message}
} +{errorMessage}
+ {resetError && ( + + )} +No post selected
+{post.title}
+{post.body}
+{user.email}
+