48 lines
1.4 KiB
JavaScript
48 lines
1.4 KiB
JavaScript
'use client';
|
|
import React, { useEffect, useState } from "react";
|
|
import Link from "next/link";
|
|
import axios from "axios";
|
|
|
|
export default function MenuList({ componentName = "MenuList" }) {
|
|
const [data, setData] = useState(null);
|
|
const [loading, setLoading] = useState(true);
|
|
const [error, setError] = useState(null);
|
|
|
|
useEffect(() => {
|
|
async function fetchData() {
|
|
try {
|
|
setLoading(true);
|
|
const res = await axios.get("/api/get-component-data", {
|
|
params: { component_name: componentName },
|
|
});
|
|
setData(res.data.data);
|
|
} catch (err) {
|
|
setError(`获取${componentName}数据失败`);
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
}
|
|
fetchData();
|
|
}, [componentName]);
|
|
|
|
if (loading) return null;
|
|
if (error) return null;
|
|
if (!data) return null;
|
|
|
|
return (
|
|
<div className="widget text-left">
|
|
<h5 className="widget-title !mb-[.75rem] !text-[.85rem] !leading-[1.45] !text-[#333333]">
|
|
{data.title}
|
|
</h5>
|
|
<ul className="pl-0 list-none text-inherit !mb-0">
|
|
{data.items?.map((elm, i) => (
|
|
<li key={i} className={i !== 0 ? "!mt-[0.35rem]" : ""}>
|
|
<Link className="!text-[#333333] hover:!text-[#1fc76f]" href={elm.item_link || "#"}>
|
|
{elm.item_title}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
);
|
|
}
|