app/components/Carousel.tsx

@@ -11,7 +11,7 @@ import {
   CarouselPrevious,
   type CarouselApi,
 } from "@/ui/carousel";
-
+import FireNewsList from "./FireNewsList";
 
 export function CarouselDemo() {
   const [api, setApi] = React.useState<CarouselApi>();
@@ -69,6 +69,7 @@ export function CarouselDemo() {
         <CarouselNext className="absolute right-2 top-1/2 -translate-y-1/2 z-10" />
       </Carousel>
 
+
       {/* 分页指示器 - 右下角 */}
       <div className="absolute bottom-4 right-4 flex gap-2 z-10">
         {Array.from({ length: count }).map((_, index) => (

app/components/FireNews/fhjt.tsx

@@ -1,19 +0,0 @@
-import { CarouselDemo } from "../Carousel";
-import {FireNewsList} from "./FireNewsList";
-
-
-export function FhjtPage() {
-    return(
-    <div className="relative w-full max-w-4xl mx-auto overflow-hidden aspect-square">
-        {/* 轮播背景图 */}
-        <div className="absolute inset-0 z-0">
-            <CarouselDemo />
-        </div>
-        
-        {/* 固定的烽火要闻 */}
-        <div className="absolute top-0 right-0 w-1/3 h-full p-1">
-            <FireNewsList />
-        </div>
-    </div>
-    )
-}

app/components/FireNews/fhrx.tsx

@@ -1,19 +0,0 @@
-import { CarouselDemo } from "../Carousel";
-import {FireNewsList} from "./FireNewsList";
-
-
-export function FhrxPage() {
-    return(
-    <div className="relative w-full max-w-4xl mx-auto overflow-hidden aspect-square">
-        {/* 轮播背景图 */}
-        <div className="absolute inset-0 z-0">
-            <CarouselDemo />
-        </div>
-        
-        {/* 固定的烽火要闻 */}
-        <div className="absolute top-0 right-0 w-1/3 h-full p-1">
-            <FireNewsList />
-        </div>
-    </div>
-    )
-}

app/components/FireNews/fhws.tsx

@@ -1,19 +0,0 @@
-import { CarouselDemo } from "../Carousel";
-import {FireNewsList} from "./FireNewsList";
-
-
-export function FhwsPage() {
-    return(
-    <div className="relative w-full max-w-4xl mx-auto overflow-hidden aspect-square">
-        {/* 轮播背景图 */}
-        <div className="absolute inset-0 z-0">
-            <CarouselDemo />
-        </div>
-        
-        {/* 固定的烽火要闻 */}
-        <div className="absolute top-0 left-0 w-1/3 h-full p-1">
-            <FireNewsList />
-        </div>
-    </div>
-    )
-}

app/components/FireNews/fhyw.tsx

@@ -1,19 +0,0 @@
-import { CarouselDemo } from "../Carousel";
-import {FireNewsList} from "./FireNewsList";
-
-
-export function FhywPage() {
-    return(
-    <div className="relative w-full max-w-4xl mx-auto overflow-hidden aspect-square">
-        {/* 轮播背景图 */}
-        <div className="absolute inset-0 z-0">
-            <CarouselDemo />
-        </div>
-        
-        {/* 固定的烽火要闻 */}
-        <div className="absolute top-0 right-0 w-1/3 h-full p-1">
-            <FireNewsList />
-        </div>
-    </div>
-    )
-}

app/components/FireNewsList.tsx

@@ -4,7 +4,7 @@ interface NewsItem {
   content: string;
 }
 
-export function FireNewsList() {
+const FireNewsList: React.FC = () => {
   const newsItems: NewsItem[] = [
     {
       content: "记者从16日召开的海南省政府新闻发布会上获悉，2018年，海南旅游总收入达1,262万人次，支出达399.7亿元...",
@@ -21,13 +21,11 @@ export function FireNewsList() {
     {
       content: "记者从16日召开的海南省政府新闻发布会上获悉，2018年，海南旅游总收入达1,262万人次，支出达399.7亿元...",
     },
-    {
-      content: "记者从16日召开的海南省政府新闻发布会上获悉，2018年，海南旅游总收入达1,262万人次，支出达399.7亿元...",
-    },
+
   ];
 
   return (
-    <div className="bg-gray-200 p-4 rounded-lg h-full">
+    <div className="bg-gray-200 p-4 rounded-lg">
       {/* 标题栏 */}
       <div className="flex justify-between items-center mb-4">
         <h2 className="text-xl font-bold text-gray-800">烽火要闻</h2>
@@ -61,3 +59,5 @@ export function FireNewsList() {
     </div>
   );
 };
+
+export default FireNewsList;

app/routes/news.tsx

@@ -6,11 +6,8 @@ import {Header} from "@/components/news/header/Header";
 import {TopNav} from "@/components/news/header/TopNav";
 import NewsList from "@/components/list/NewsList";
 import ImageGridSection from "@/components/body/ImageGridSection";
+import { CarouselDemo } from "@/components/Carousel";
 import GrassrootsDynamics from "@/components/body/GrassrootsDynamics";
-import { FhywPage } from "@/components/FireNews/fhyw";
-import { FhjtPage } from "@/components/FireNews/fhjt";
-import { FhwsPage } from "@/components/FireNews/fhws";
-import { FhrxPage } from "@/components/FireNews/fhrx";
 export function meta( ) {
   return [
     { title: "New React Router App" },
@@ -24,12 +21,9 @@ export default function Home() {
     <div>
       <Header />
       <TopNav />
-      <FhywPage />
+      <CarouselDemo />
       <NewsList />
       <ImageGridSection />
-      <FhjtPage/>
-      <FhwsPage/>
-      <FhrxPage />  
       <Integrated />
       <CultureBgPage />
     </div>