faq.md 1.8 KB

问:为什么没有栅格组件?

答:直接使用 CSS 的 Flexbox 特性,已经可以很方便快速地实现栅格布局,不再需要为了实现栅格布局而引入额外的组件,而且使用 Tailwind CSS 书写会非常简洁。

问:部分组件的 Props 需要传入 String 类型,但传入 Number 类型也完全正常使用?

答:由于组件内部这些 Props 作为 Object 的 key,严格来说应该传入 String 类型,若传入数字也会被转为 String,所以传入 Number 或者 String 类型都是可以的,开启类型检查的时候会有类型报错。虽然可以正常使用,但还是建议传入规定的类型。

问:为什么主题色会有亮色(primary)和暗色(dark)两种颜色?

答:STDF 的主题系统采用双主题色设计,这是为了在亮色模式和暗色模式下都能呈现最佳的视觉效果。亮色模式下使用 primary 色,暗色模式下使用 dark 色。这样设计的原因是:同一种颜色在浅色背景和深色背景上的视觉感受是不同的,为了保证在两种模式下都有良好的对比度和可读性,需要分别配置两种主题色。例如,一个在白色背景上看起来很舒适的蓝色,直接用在黑色背景上可能会显得过于刺眼或对比度不足。通过分别配置亮色和暗色主题色,可以确保应用在任何模式下都有最佳的用户体验。

问:为什么全局主题配置了圆角,组件内部又有圆角配置?

答:全局圆角(--radius-box--radius-form--radius-small)确保整体风格统一,组件的 radius 属性则用于特殊场景覆盖。例如:头像需要圆形、大圆角卡片内的按钮需要小圆角等。未指定时使用全局值,指定后覆盖全局配置。