Tôi đang cố gắng viết một thư viện thành phần có thể tái sử dụng và nảy ra câu hỏi này khiến tôi băn khoăn một thời gian.
我已经使用 ví dụ Được cung cấp với công cụ mẫu được bảo hiểm. Tôi nghĩ đoạn "Ghi chú nhanh về ghi đè mẫu" của anh ấy đề cập đến vấn đề của tôi (Tuy nhiên, tôi không chắc chắn, vấn đề của tôi có thể khác). Nhưng tôi không biết làm thế nào để thực hiện nó. Bất kỳ trợ giúp đều được đánh giá cao. Câu hỏi là:
Công cụ tạo mẫu của tôi về cơ bản đăng ký các mẫu dưới dạng "templateName" và "markUp". Đầu tiên mình có model sản phẩm như hình dưới đây:
var Sản phẩm = chức năng(img, nhãn hiệu, mô tả){
this.img = img;
this.brand = thương hiệu;
this.description = mô tả;
};
Sau đó, Chế độ xem của cha mẹ tôi là:
{
tên: 'xem danh sách sản phẩm',
mẫu: '\
\
'
}
Bây giờ, trong nàychế độ xem danh sách sản phẩm
Trong viewModel của View,danh sách sản phẩm
Tài sản được định nghĩa là mộtSản phẩm
Mảng sơ thẩm. hộp sản phẩm
Các thành phần nên được sử dụng cho mỗi Sản phẩm
Tạo một viewModel và một mẫu liên quan. Thành phần hộp sản phẩm được đăng ký dưới dạng loại trực tiếp bằng cách sử dụng:
ko.comComponents.register('product-box', {
'viewModel': hàm(params){
this.product = params.product;
this.getProduct = function(){
//Sẽ thực hiện lệnh gọi ajax tại đây
};
},
'template': '\
![]()
\
\
\
'
})
Tôi biết rằng trong đoạn mã trên,nhận đượcSản phẩm
Phương thức này có hai ràng buộc. Tôi sẽ đạt được điều đó. Bây giờ, hãy tưởng tượng rằng sản phẩm trong ListView không tồn tại.
HTML được tạo bởi đoạn mã trên trông như thế này:
![]()
Trong đoạn mã trên,hộp sản phẩm
trình bao bọc trong phần tử div
Hoàn toàn không cần thiết vì nó chỉ bao bọc phần tử. Ngoài ra, phần tử này đã được chứa trong hộp sản phẩm
yếu tố. Vì vậy, tôi muốn loại bỏ div gói. Vấn đề ở đây là tôi cần có thể nhấp vào toàn bộ hình ảnh sản phẩm nhưng tôi không thể liên kết sự kiện nhấp chuột với phương thức getProduct trong mẫu chế độ xem danh sách sản phẩm.当 foreach
hiện hữu chế độ xem danh sách sản phẩm
Lặp lại vòng lặp trong mẫu, $data trỏ tới product mô hình thay vì lượt xemMô hình
(Còn gọi là hộp sản phẩm).
Làm cách nào để đặt phương thức getProduct này từ Chế độ xem gốc?
Có cách nào để loại bỏ div bao bì không cần thiết trong hộp sản phẩm không?
Nói cách khác, làm cách nào tôi có thể có thành phần hộp sản phẩm có thể nhấp được như thế này:
![]()
...
Tôi là một lập trình viên xuất sắc, rất giỏi!