设置切换

用于让商家控制可以打开或关闭的功能或选项。

在设置页面上使用允许商家切换激活或禁用状态的设置。

进口｛SettingToggle，TextStyle｝从“@shopify /北极星”；进口｛useState，useCallback｝从“反应”；函数SettingToggleExample（）｛常量［活跃的，setActive］＝useState（假）；常量handleToggle＝useCallback（（）= >setActive（（活跃的）= >！活跃的），［］）；常量contentStatus＝活跃的?“注销”：“激活”；常量textStatus＝活跃的?“激活”：“停用”；返回（<SettingToggle行动＝｛｛内容：contentStatus，onAction：handleToggle，｝｝启用＝｛活跃的｝>这个设置是<TextStyle变异＝“强”>｛textStatus｝</TextStyle>．</SettingToggle>）；｝

道具

想要帮助完善这个功能吗?请<！-- -->分享你的反馈．

接口<！-- --> SettingToggleProps<！-- -->

孩子们? 反应．ReactNode: 卡片的内部内容。
行动?: 卡头动作。
启用? 布尔: 将切换状态设置为激活或禁用。

最佳实践

设置切换应该:

为激活和非激活状态包含不同的主体内容。
清楚地表明设置是激活还是禁用，并向商家解释设置状态的含义。(“自动消息已被禁用。你的客户不会收到自动发货更新。”)
清楚地说明什么时候某个设置或功能不可用以及为什么不可用。为商家提供可操作的步骤来解锁功能。

内容的指导方针

切换描述

切换描述应该:

清楚地表明该设置是激活还是禁用
向商家解释设置状态的含义(“自动消息已禁用。你的客户不会收到自动发货更新。”)

主要按钮

设置切换的主按钮应该始终显示“激活”或“禁用”，这取决于设置是否可以打开或关闭。

例如，如果设置开关是打开的，按钮应该显示“Deactivate”以允许商家关闭它。如果设置开关关闭，按钮应该显示“激活”以允许商家打开它。

做

激活
禁用

不

启用
禁用
打开
关掉

为了让商家连接或断开第三方服务和应用程序，使用帐户连接组件

可访问性

设置切换组件以HTML的形式实现< >按钮与开关咏叹调的作用．作为子元素传递的组件将自动包装在描述的label元素中< >按钮．启用和禁用SettingToggle与更新aria-checked属性来“真正的”或“假”．

要了解有关按钮可访问性的更多信息，请参见按钮组件．