# HTProtocol 协议勾选组件

HTProtocol 是一个带有勾选状态的协议/同意组件，常用于用户注册、提交表单前的「我已阅读并同意协议」等场景。支持自定义文本、样式及类名，并可通过 v-model 双向绑定选中状态。

# 基本用法

# 使用 content 属性

# 使用插槽自定义内容

# Props 参数

参数名 说明 类型 默认值
content 协议文案（当未使用插槽时生效） string ''
customClasses 自定义类名，可传字符串或数组 string / array ''
styles 自定义样式对象 object {}
value 选中状态（支持 v-model 双向绑定） string / number / array / boolean false

# 事件

事件名 说明 回调参数
update:value v-model 更新事件 新的选中状态
input 输入事件（切换状态时触发） 新的选中状态
change 状态切换完成时触发 新的选中状态

# 插槽

插槽名 说明
default 自定义显示内容，替代 content 文案

# 样式类名

类名 说明
.ht-protocol 组件根元素
.ht-protocol__checkbox 勾选框区域
.ht-protocol__content 文案内容区域
.active 已选中状态时应用在 checkbox

# 交互逻辑

  • 点击勾选框或文案都会触发状态切换；
  • 选中状态为 true 时，显示 protocol-checked 图标；
  • 未选中状态时，显示 Circle 图标；
  • 支持 v-model 与父组件进行数据绑定；
  • 同时触发 input、update:value 和 change 事件。

# 注意事项

  • 如果既传了 content 又在插槽中写了内容，插槽优先；
  • value 支持多种类型，但在常规协议勾选场景下建议使用 boolean；
  • 图标 HTIcon 必须保证在项目中可用。

HTRadio 单选框