QToggle 组件是另一个用于用户输入的基本元素。您可以使用它来打开和关闭设置、功能或真/假输入。

用法

基本用法

使用 color 属性控制切换的颜色。

带标签

保持颜色

带图标

自定义模型值

您可以使用自定义值，而不是默认的 true / false 值。

不确定状态

在下面的示例中，只要您点击第一个 QToggle，它就开始在 true/false 之间切换。另一方面，第二个 QToggle 在三个状态（不确定/true/false）之间切换，借助于 toggle-indeterminate。您可以选择设置属性 indeterminate-value，否则不确定值将被视为 null。

切换顺序

默认情况下，QToggle 在切换时遵循以下链：不确定 -> 已选中 -> 未选中。但是，您可以通过 toggle-order 属性更改此行为。此属性确定状态的顺序，可以是 tf（默认）或 ft（t 代表 true/已选中状态，而 f 代表 false/未选中状态）。

切换顺序是

• 如果 toggle-indeterminate 为 true，则：不确定 -> 第一个状态 -> 第二个状态 -> 不确定（并重复）
• 否则（没有 toggle-indeterminate）：不确定 -> 第一个状态 -> 第二个状态 -> 第一个状态 -> 第二个状态 -> …

数组模型

如果您有多个切换用于选择，可以使用数组作为所有切换的模型，并在每个切换上指定 val 属性。如果切换被选中，则其 val 将被插入到数组中，反之亦然。

暗黑模式

禁用

尺寸

除了以下标准尺寸外，您还可以通过 size 属性定义自己的尺寸（最后一个是自定义尺寸）。

与 QOptionGroup 一起使用

与 QItem 一起使用

原生表单提交

当处理具有 action 和 method 的原生表单时（例如，当将 Quasar 与 ASP.NET 控制器一起使用时），您需要在 QToggle 上指定 name 属性，否则 formData 将不包含它（如果应该包含）- 所有值都将转换为字符串（原生行为，因此不要使用对象值）