Download the PHP package bsscommerce/hyva-compat-base without Composer
On this page you can find all versions of the php package bsscommerce/hyva-compat-base. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download bsscommerce/hyva-compat-base
More information about bsscommerce/hyva-compat-base
Files in bsscommerce/hyva-compat-base
Package hyva-compat-base
Short Description Base module for Hyvä Compat Modules
License OSL-3.0 AFL-3.0
Informations about the package hyva-compat-base
Bss Commerce
Hyva Theme Compatible Base Module
Những điểm override/thêm mới trong module base này
- Template của block
header.customer
được override sangBss_HyvaCompatBase::header/customer-menu.phtml
- Template của block
product_list_item
được override sangBss_HyvaCompatBase::product/list/item.phtml
- Thêm
responseSerialize
cho fetch API. - Thêm plugin
component.js
cho AlpineJS.
Chi Tiết
-
Template của block
header.customer
được override- Mục đích là để tách nhỏ các link của customer thành từng block, khi implement thì chỉ cần reference vào block
customer.logged-menu
hoặccustomer.not-login-menu
rồi định nghĩa 1 link mới - Lý do bởi vì hiện tại Hyva đang viết tất cả các link vào trong cùng 1 block và cùng 1 template.
- Base class của link là
Bss\HyvaCompatBase\Block\Customer\Menu\CustomerMenuLink
cùng với template làBss_HyvaCompatBase::header/customer-menu/link-default.phtml
- Chi tiết hơn thì Dev có thể check thêm.
- Mục đích là để tách nhỏ các link của customer thành từng block, khi implement thì chỉ cần reference vào block
-
Thêm plugin
component.js
cho AlpineJS.- Mục đích của cái này đó chính là để giao tiếp giữa các component của alpineJS.
- Hiện tại khi mình tạo 1 block mới, khai báo x-data cho block đó thì lại không thể sử dụng được data của parent hoặc là của 1 x-data khác nằm ngoài phạm vi.
-
Ví dụ: Tại cart page, Hyva có định nghĩa 1 cái là
initCart
, mình tạo block bên trong nó, định nghĩa x-data của mình, nhưng mình muốn sử dụng data củainitCart
(parrent) hoặc chỉnh sửa data củainitCart
thì không được (Hoặc có thể do mình kiến thức không đủ nên chưa biết cách thức sử dụng). Nên tìm kiếm trên google thì bắt được cái plugin này dành cho AlpineJS để có thể lấy, sửa được data của các x-data khác. -
Note:
Plugin đã được mình sửa 1 chỗ phần tìm kiếm theo tên của component để có thể sử dụng được cho các trường hợp component không được định nghĩa id mà chỉ có functionName.
document.querySelector('[x-data="'+a+'()"], [x-data][x-id="'+a+'"]
, trong đó phần được thêm là'[x-data="'+a+'()"],
. -
Cách sử dụng Tại layout cần sử dụng, khai báo handle đã được định nghĩa trong module base. Ví dụ
Tiếp Theo tại phần html có thể sử dụng như dạng
hoặc trong phần JS
componentName
có thể là tên function js mà component cần giao tiếp khai báo trogn x-data hoặc là id của thẻ chứa x-data (ở trên làsubmit_form
), hoặc là giá trịx-id
-
Thêm thư viện Splide Js
- Thư viện được sử dụng để làm slide
- Không ảnh hưởng tới LCP và CLS