# react-mac-dock **Repository Path**: twp0217/react-mac-dock ## Basic Information - **Project Name**: react-mac-dock - **Description**: React Mac Dock(Mac 程序坞) - **Primary Language**: TypeScript - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2021-09-18 - **Last Updated**: 2021-09-18 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # react-mac-dock - Mac 程序坞 ## 使用 ```typescript import React from 'react'; import MacDock, { MacDockItem } from '@twp0217/react-mac-dock'; import './index.less'; export default () => { const items: MacDockItem[] = [ { label: 'nautilus', icon: 'https://twp0217.github.io/react-mac-dock/demo/nautilus.png', }, { label: 'opera', icon: 'https://twp0217.github.io/react-mac-dock/demo/opera.png', }, { label: 'addressbook', icon: 'https://twp0217.github.io/react-mac-dock/demo/addressbook.png', }, { label: 'dictionary', icon: 'https://twp0217.github.io/react-mac-dock/demo/dictionary.png', }, { label: 'update', icon: 'https://twp0217.github.io/react-mac-dock/demo/update.png', }, { label: 'settings', icon: 'https://twp0217.github.io/react-mac-dock/demo/settings.png', }, { label: 'trash', icon: 'https://twp0217.github.io/react-mac-dock/demo/trash.png', }, ]; return (
); }; ``` ## API ### MacDockItem | 名称 | 类型 | 默认值 | 说明 | | ----- | ---------------- | ------ | ----- | | label | string \| number | - | key | | icon | number | - | label | ### MacDockProps | 名称 | 类型 | 默认值 | 说明 | | ---------- | ------------------------------------------------------------------- | --------- | ---------------- | | className | string | - | 类名 | | style | React.CSSProperties | - | 样式 | | placement | `top` \| `bottom` \| `left` \| `right` | `bottom` | 位置 | | size | `default` \| `small` \| number | `default` | 图标大小 | | items | MacDockItem[] | - | 数据 | | renderItem | (item: MacDockItem, originNode: React.ReactNode) => React.ReactNode | - | 自定义渲染列表项 | | onClick | (item: MacDockItem) => void | - | 点击节点时的回调 | ## 支持 - 如果项目对你有帮助,请点颗星星:star:,谢谢。 - 如果你对项目有想法、问题、BUG,欢迎讨论。