Alpine.js 响应式组件演示

轻量级响应式JavaScript框架,让HTML具备响应性

响应式计数器

当前步长:
实时状态
  • 当前计数:
  • 步长:
  • 是否为正数:
  • 是否为偶数:
  • 绝对值:

待办事项管理

暂无待办事项

统计信息
总计
进行中
已完成
完成率

动态标签页

实时表单验证

验证状态
通过验证
验证错误
用户名:
邮箱:
密码:
确认密码:
用户协议:

购物车管理

商品列表
购物车

购物车为空


商品总计:
运费:
总计:

Alpine.js 主要特性

轻量级
  • 仅21KB (gzipped)
  • 无需构建步骤
  • 直接在HTML中使用
  • 零依赖
响应式
  • 数据双向绑定
  • 自动DOM更新
  • 条件渲染
  • 列表渲染
组合性
  • 15个指令
  • 6个魔法属性
  • 可复用组件
  • 插件生态