xStore.filters#

Bộ lọc của một danh mục: thương hiệu, khoảng giá, thuộc tính. Cấu hình KẾ THỪA từ danh mục cha.

Phương thức#

Ví dụ đầy đủ#

<script>
  // Bộ lọc luôn gắn với MỘT danh mục. Cấu hình kế thừa từ danh mục cha,
  // nên kết quả rỗng nghĩa là cả nhánh tổ tiên chưa cấu hình gì —
  // KHÔNG phải dấu hiệu để gọi lại với id của danh mục cha.
  async function renderFilters(categoryId) {
    const bl = await xStore.filters.forCategory(categoryId);

    document.getElementById('brands').innerHTML =
      (bl.brands ?? []).map((h) => `<label><input type="checkbox" value="${h.id}"> ${h.title}</label>`).join('');

    document.getElementById('prices').innerHTML =
      (bl.prices ?? []).map((k) => `<label><input type="radio" name="price" value="${k.id}"> ${k.label}</label>`).join('');

    document.getElementById('attrs').innerHTML =
      (bl.attributes ?? []).map((t) => `
        <fieldset>
          <legend>${t.title}</legend>
          ${(t.options ?? []).map((o) => `<label><input type="checkbox" value="${o.value}"> ${o.label}</label>`).join('')}
        </fieldset>
      `).join('');
  }
</script>

Thư viện gọi tới /api/... trên chính tên miền cửa hàng, nên không cần khai báo địa chỉ máy chủ ở bất kỳ đâu.

Xem thêm Sự kiện để giao diện tự cập nhật sau mỗi thao tác.