Skip to content
通用与布局组合组件

NnSettingsItem 设置项

设置说明与操作控件的双列布局。

示例

API

Props

名称类型默认值说明
titlestring | number''设置项标题;0 会正常显示。
descriptionstring | number''设置项补充说明;0 会正常显示。
alignstring'start'center 让两列整体垂直居中,其他值保持顶部对齐。
actionsWidthnumber | string操作区宽度;数字按 px,字符串作为 CSS width。窄容器下自动变为全宽。
labelForstring''设置后标题使用 <label for="...">,用于关联操作区中的单一可标记控件。

Slots

名称作用域参数说明
title替换设置项标题。
description替换设置项说明。
actions右侧操作区;未提供时,默认插槽会作为操作区的简写。
defaultactions 未提供时使用的操作区内容。

组件默认使用与旧式偏好设置一致的紧凑密度:160px 最小文案列、66px 最小行高、顶部对齐与行间分隔。 当最近的 NnSettings 容器不超过 520px 时改为单列,操作区全宽并左对齐;同时提供 720px 视口 媒体查询作为不支持 container query 环境的兜底。结构节点固定提供 data-nn-settings-itemdata-nn-settings-item-copydata-nn-settings-item-titledata-nn-settings-item-descriptiondata-nn-settings-item-actions

Released under the MIT License.