page.tsx
1.52 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
import React, { useState, useEffect } from 'react';
import MainTitleList from '@/components/MainTitleList'; // 确保你有相应的React版本
import MainTitleListOdd from '@/components/MainTitleListOdd'; // 确保你有相应的React版本
import { useCategoryStore } from '@/stores/category'; // 确保你有相应的React版本
import { isMobile } from '@/utils'; // 确保你有相应的React版本
import { Carousel } from '@mui/material';
const HomePage = () => {
const store = useCategoryStore();
const [lab, setLab] = useState({ categoryDisplayName: '', list: [] });
useEffect(() => {
if (store?.list?.[3]) {
setLab(store.list[3]);
}
}, [store]);
const banners = [
'/banner/banner1.jpg',
'/banner/banner2.jpg',
'/banner/banner3.jpg',
'/banner/banner4.jpg',
];
const mobileBanners = [
'/mobile/banner-index1.png',
'/mobile/banner-index2.png',
'/mobile/banner-index3.png',
];
// ... 其他数据如 materials, tests, batteries, packs 保持不变
console.log(
'%c [ banners ]-111',
'font-size:13px; background:pink; color:#bf2c9f;',
banners
);
return (
<div className="tw-w-full">
<Carousel hideDelimiterBackground showArrowsOnHover height="auto">
{banners.map((banner) => (
<CarouselItem src={banner} cover alt="canrud" key={banner} />
))}
</Carousel>
{/* 其他部分 */}
{/* ... 其他代码保持不变,只是将Vue特有的语法替换成React的语法 */}
</div>
);
};
export default HomePage;