组件JSON类型参数切换其他再回来参数被清空

 import React from '@blocklet/pages-kit/builtin/react';
import { Box, Grid, Typography, Link, Card, CardContent } from '@blocklet/pages-kit/builtin/mui/material';

export default function Navigation({ navItems=[] }) {
  
  return (
    <Box
      sx={{
        maxWidth: 1200,
        margin: '0 auto',
        padding: '2rem',
        backgroundColor: '#F8FAFC',
        boxShadow: '0 4px 6px -1px rgba(0,0,0,0.1)',
      }}>
     
      <Grid container spacing={3} justifyContent="center">
        {navItems.map((item) => (
          <Grid item xs={12} sm={8} md={4} lg={2} key={item.id}>
            <Link
              href={item.href}
              component={Card}
              sx={{
                textDecoration: 'none',
                height: '100%',
                transition: 'transform 0.3s, box-shadow 0.3s',
                '&:hover': {
                  transform: 'translateY(-5px)',
                  boxShadow: '0 10px 15px -3px rgba(0,0,0,0.1)',
                },
              }}>
              <CardContent
                sx={{
                  display: 'flex',
                  flexDirection: 'column',
                  alignItems: 'center',
                  p: 3,
                  backgroundColor: item.color,
                  color: 'white',

                  position: 'relative',
                  overflow: 'hidden',
                }}>
                <Typography
                  variant="h6"
                  sx={{
                    fontSize: '1.2rem',
                    fontWeight: 600,
                    mb: 1,
                    textTransform: 'uppercase',
                    letterSpacing: '0.05em',
                  }}>
                  {item.label}
                </Typography>
                <Box
                  sx={{
                    position: 'absolute',
                    bottom: 0,
                    left: 0,
                    right: 0,
                    height: '40%',
                    background: 'linear-gradient(transparent, rgba(0,0,0,0.3))',
                  }}
                />
              </CardContent>
            </Link>
          </Grid>
        ))}
      </Grid>
    </Box>
  );
}