@@ -165,8 +165,8 @@ export function Banner({
165
165
166
166
``` tsx
167
167
// layout
168
- import { Banner } from " ../components/Banner" ;
169
- import { getDailyWord } from " @/utils/getDailyWord" ;
168
+ import { Banner } from ' ../components/Banner' ;
169
+ import { getDailyWord } from ' @/utils/getDailyWord' ;
170
170
171
171
export default async function FrontLayout({
172
172
children ,
@@ -179,25 +179,21 @@ export default async function FrontLayout({
179
179
return (
180
180
<div className = " flex flex-col items-center" >
181
181
<div className = " w-[100vw]" >
182
- <Banner
183
- language = { language }
184
- isGetDailyWord = { true }
185
- wordsFetch = { wordsFetch }
186
- ></Banner >
182
+ <Banner language = { language } isGetDailyWord = { true } wordsFetch = { wordsFetch } ></Banner >
187
183
</div >
188
184
<section className = " w-full" >{ children } </section >
189
185
</div >
190
186
);
191
187
}
192
188
// TypeWrite
193
- (" use client" );
194
- import { usePathname } from " next/navigation" ;
195
- import { ReactTyped } from " react-typed" ;
196
- import { getDailyWord } from " @/utils/getDailyWord" ;
197
- import { Suspense , use , useState } from " react" ;
198
- import { DailyWord } from " @/utils/getDailyWord" ;
199
- import { splitPathname } from " @/utils/dealPathname" ;
200
- import { useTranslation } from " @/app/i18n/client" ;
189
+ (' use client' );
190
+ import { usePathname } from ' next/navigation' ;
191
+ import { ReactTyped } from ' react-typed' ;
192
+ import { getDailyWord } from ' @/utils/getDailyWord' ;
193
+ import { Suspense , use , useState } from ' react' ;
194
+ import { DailyWord } from ' @/utils/getDailyWord' ;
195
+ import { splitPathname } from ' @/utils/dealPathname' ;
196
+ import { useTranslation } from ' @/app/i18n/client' ;
201
197
export function MyTypeWrite({
202
198
language ,
203
199
isGetDailyWord ,
@@ -210,21 +206,21 @@ export function MyTypeWrite({
210
206
let word;
211
207
const pathName = usePathname ();
212
208
const title = splitPathname (pathName );
213
- const { t } = useTranslation (language , " translations" );
209
+ const { t } = useTranslation (language , ' translations' );
214
210
if (isGetDailyWord && wordsFetch ) {
215
211
const words = use (wordsFetch );
216
- word = language === " zh-CN" ? words .note : words .content ;
212
+ word = language === ' zh-CN' ? words .note : words .content ;
217
213
}
218
214
return (
219
215
<ReactTyped
220
216
strings = { ! word ? [t (title )] : [word ]}
221
217
typeSpeed = { 50 }
222
218
style = { {
223
- display: " flex" ,
224
- lineHeight: " 250px" ,
225
- fontSize: " 4rem" ,
226
- justifyContent: " center" ,
227
- color: " white" ,
219
+ display: ' flex' ,
220
+ lineHeight: ' 250px' ,
221
+ fontSize: ' 4rem' ,
222
+ justifyContent: ' center' ,
223
+ color: ' white' ,
228
224
}}
229
225
/>
230
226
);
@@ -249,4 +245,4 @@ React19的更新远不止于此,目前我只用上这两个方法。
249
245
250
246
[ 关于USE] ( https://react.dev/reference/react/use )
251
247
252
- [ 关于Compiler] ( https://react.dev/learn/react-compiler# )
248
+ [ 关于Compiler] ( https://react.dev/learn/react-compiler# )
0 commit comments