SearchDrawer 组件测试页面

测试不同类型的数据

当前测试数据:

标题: 数组类型测试

数据类型: Array

数据长度: 4

展开查看详细数据
[
  {
    "title": "测试商品1",
    "website": "https://example.com/product1",
    "image": "https://via.placeholder.com/200x150/FF6B6B/FFFFFF?text=商品1",
    "price": "¥99.00"
  },
  {
    "title": "测试商品2",
    "website": "https://example.com/product2",
    "image": "https://via.placeholder.com/200x150/4ECDC4/FFFFFF?text=商品2",
    "price": "¥199.00"
  },
  {
    "title": "测试商品3",
    "website": "https://example.com/product3",
    "image": "https://via.placeholder.com/200x150/45B7D1/FFFFFF?text=商品3",
    "price": "¥299.00"
  },
  {
    "title": "测试商品4",
    "website": "https://example.com/product4",
    "image": "https://via.placeholder.com/200x150/96CEB4/FFFFFF?text=商品4",
    "price": "¥399.00"
  }
]

SearchDrawer 组件展示

使用说明

  • 支持的数据格式:
    • 数组格式: [{title: '...', website: '...', image: '...', price: '...'}]
    • 对象格式: {total: [...]}
    • 嵌套对象格式: {key1: {...}, key2: {...}}
  • 必需字段: title, website, image, price
  • 组件特性: 自动数据类型检测、响应式更新、加载状态管理