Skip to content
仅桌面端保证样式

Newsletter 订阅

EwNewsletter 是一体式邮件订阅框:邮箱输入 + 主按钮胶囊合体,focus 浮现主色光环。 提交后自动切换为成功态;真实订阅逻辑在 subscribe 事件中接你自己的接口。

基础用法

提交与成功态
试一试:输入任意邮箱提交,观察成功态切换。
vue
<EwNewsletter
  placeholder="输入你的邮箱"
  button-text="订阅更新"
  @subscribe="(email) => api.subscribe(email)"
/>

摆放位置

最常见的两个位置:EwCta 的 default 插槽里(转化收尾),或页脚上方独立成段。

API

Props

属性说明类型默认值
placeholder占位文案string'输入你的邮箱'
button-text按钮文案string'订阅'
subscribed-text成功态文案string'订阅成功,请查收确认邮件'
pill按钮胶囊形态booleantrue

插槽

插槽说明
subscribed成功态文案覆写

事件

事件说明参数
subscribe表单提交(通过浏览器原生 email 校验后)email

基于 MIT 许可证发布