SuperAPI AI 工具集

mantine

前端与建站

查看项目

更新于 10-16 00:29

技能介绍

用途:Mantine 是面向 React 应用的组件库,用于快速搭建功能丰富的用户界面,内置深色模式与无障碍支持,并提供表单库。

主要能力:包含 100 多个可定制组件与 50 多个 hooks。组件涵盖按钮、文本输入、密码输入、文本域、数字输入、Select、MultiSelect、Combobox、Modal、Drawer、Notifications、Tabs、Card 等;布局组件包括 AppShell、Container、Grid、Group、Stack、Flex、SimpleGrid、Center。hooks 包括 useDisclosure、useToggle、useDebouncedValue、useClipboard、useLocalStorage、useMediaQuery、useClickOutside、useHotkeys、useForm 等。表单库 @mantine/form 支持校验,并可通过 zodResolver 结合 Zod 做类型安全校验。主题支持自定义颜色、字体、间距、圆角、阴影、焦点样式,并支持深色模式切换。样式可通过 classNames、styles 属性或 CSS Modules 覆盖,也可使用 CSS 变量访问主题令牌。

使用方式:安装核心包与 hooks:npm install @mantine/core @mantine/hooks;开发依赖:npm install -D postcss postcss-preset-mantine postcss-simple-vars。需配置 postcss.config.cjs,并在应用入口引入 '@mantine/core/styles.css',用 MantineProvider 包裹应用。通知需安装 @mantine/notifications 并引入其样式;表单需安装 @mantine/form。

适用场景:适合需要丰富组件、深色模式、无障碍支持与表单校验的 React 项目。

限制:资料未提供收费、价格、平台兼容范围或性能数据,暂未提供。