Руководство Wix по созданию списка связанных продуктов не перезагружается - PullRequest
Новая
       10

Руководство Wix по созданию списка связанных продуктов не перезагружается

2 голосов
/ 18 июня 2019

Я следовал руководству Wix, чтобы создать область «Сопутствующие товары» в нижней части страницы их динамического продукта.

В основном это работает так, как вы ожидаете.Проблема возникает, когда вы нажимаете на один из связанных продуктов и видите, что список связанных продуктов не изменяется, чтобы отразить текущий загруженный продукт.

Единственный способ получить список связанных продуктов, который нужно изменить, - обновитьстраницы.

Есть ли простое решение для этого?Ниже приведен их код: 

import wixData from 'wix-data';
import wixLocation from 'wix-location';

$w.onReady(function () {
 loadRelatedProducts();
});

async function loadRelatedProducts() {
 let product = await $w('#productPage1').getProduct();
 let relatedProductResults = await Promise.all([
  relatedProductsByTable(product),
  relatedProductsByPrice(product)
  ]);

 if (relatedProductResults[0].length > 0)
  showRelatedProducts(relatedProductResults[0]);
 else
  showRelatedProducts(relatedProductResults[1]);
}


async function relatedProductsByTable(product) {
 let productId = product._id;

 // find related products by relation table
 let relatedByTable = await Promise.all([
  wixData.query('RelatedProducts')
  .eq('productA', productId)
  .include('productB')
  .find(),
  wixData.query('RelatedProducts')
  .eq('productB', productId)
  .include('productA')
  .find()
 ]);

 let relatedProducts = [
  ...relatedByTable[0].items.map(_ => _.productB),
  ...relatedByTable[1].items.map(_ => _.productA)
 ];
 return relatedProducts;
}



async function relatedProductsByPrice(product) {
 let productId = product._id;

 // find related products by price
 let relatedByPrice = await wixData.query('Stores/Products')
  .between('price', product.price * 0.8, product.price * 1.2)
  .ne('_id', productId)
  .find();
 return relatedByPrice.items;
}



function showRelatedProducts(relatedProducts){
 if(relatedProducts.length > 0){
     relatedProducts.splice(4, relatedProducts.length);
  $w('#relatedItemsRepeater').onItemReady(relatedItemReady);
  $w("#relatedItemsRepeater").data = relatedProducts;
  $w("#relatedItems").expand();
 }
 else {
  $w("#relatedItems").collapse();
 }
}



function relatedItemReady($w, product){
 $w("#productImage").src = product.mainMedia;
 $w("#productName").text = product.name;
 $w("#productPrice").text = product.formattedPrice;
 $w('#productImage').onClick(() => {
  wixLocation.to(product.productPageUrl);
 });
}

Я подозреваю, что проблема заключается в том, что все это вызвано событием .onReady().К сожалению, я не уверен, как также выполнить этот повторный запуск для другого триггера, например, при щелчке по самому связанному элементу.

Сама страница не перезагружается при нажатии на один из связанных продуктов.Вместо этого я считаю, что они просто переписывают URL-адрес, а затем обновляют, а затем повторно извлекают данные из базы данных.

1 Ответ

2 голосов
/ 18 июня 2019

Действительно, вы правы. Сама страница не перезагружается, когда выбран связанный элемент, поэтому новый список связанных элементов не создается. На самом деле, на момент публикации этого примера не было простого способа обойти это.

С тех пор Wix предоставил функцию wix-location.onChange(), чтобы решить эту проблему. Все, что вам нужно сделать, это добавить следующую строку: 

wixLocation.onChange( () => loadRelatedProducts() );

Вероятно, имеет смысл добавить его прямо перед onReady() или даже внутри onReady().

...