63 lines
2.0 KiB
TypeScript
63 lines
2.0 KiB
TypeScript
import React from 'react';
|
||
|
||
interface NewsItem {
|
||
content: string;
|
||
}
|
||
|
||
const FireNewsList: React.FC = () => {
|
||
const newsItems: NewsItem[] = [
|
||
{
|
||
content: "记者从16日召开的海南省政府新闻发布会上获悉,2018年,海南旅游总收入达1,262万人次,支出达399.7亿元...",
|
||
},
|
||
{
|
||
content: "记者从16日召开的海南省政府新闻发布会上获悉,2018年,海南旅游总收入达1,262万人次,支出达399.7亿元...",
|
||
},
|
||
{
|
||
content: "记者从16日召开的海南省政府新闻发布会上获悉,2018年,海南旅游总收入达1,262万人次,支出达399.7亿元...",
|
||
},
|
||
{
|
||
content: "记者从16日召开的海南省政府新闻发布会上获悉,2018年,海南旅游总收入达1,262万人次,支出达399.7亿元...",
|
||
},
|
||
{
|
||
content: "记者从16日召开的海南省政府新闻发布会上获悉,2018年,海南旅游总收入达1,262万人次,支出达399.7亿元...",
|
||
},
|
||
|
||
];
|
||
|
||
return (
|
||
<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>
|
||
<a className="text-blue-600 hover:text-blue-800 font-medium">
|
||
查看更多 {'>'}
|
||
</a>
|
||
</div>
|
||
|
||
{/* 新闻列表 */}
|
||
<div className="space-y-4">
|
||
{newsItems.map((item, index) => (
|
||
<div
|
||
key={index}
|
||
className="flex p-3 bg-white rounded-md shadow-sm hover:shadow-md transition-shadow duration-200"
|
||
>
|
||
|
||
{/* 内容部分 */}
|
||
<div className="flex-1 min-w-0">
|
||
<p className="text-gray-700 text-sm ">
|
||
{item.content}
|
||
<a
|
||
className="text-red-600 ml-1 font-medium hover:text-red-800"
|
||
>
|
||
[MORE]
|
||
</a>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
))}
|
||
</div>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
export default FireNewsList; |