показать базу продукта по URL-адресу браузера - PullRequest
Новая
       6

показать базу продукта по URL-адресу браузера

1 голос
/ 01 августа 2020

Я хочу показать динамику продукта c базу по ссылке в браузере. Например, если http://www.example.com?product=[data.productList.id], тогда покажите data.productList.text

Ожидаемые результаты: если http://www.example.com?product=62276197-6059-4c21-9b40-c5b1d277e85d тогда покажите Продукт 001 .

Я пробовал много методов.

Мой js ниже: 

const browserId = data.productList.id

if (window.location.href.contains('?product=' + browserId) > -1) {
    $('.test').append(productItemName(data.productList.id))
}
function productItemName(productName) {
    return data.productList.filter(product => product.id === productName)?.[0]?.id;
}

мои данные js ниже: 

var data = {
    productList: [
    {
        id: "62276197-6059-4c21-9b40-c5b1d277e85d",
        link: "javascript:void(0)",
        imgurl: "/img/upload/png/joyacart_000001_12032019.png",
        text: 'Product 001',
        price: '368.00',
        hitRate: '45472',
        goldMedal: false,
        newItem: true,
        newShop: true,
        freeDelivery: true,
        ShopId: '5cfb048c-86e8-4d2d-85bf-e4e9e1effdcb'
        },
        {
        id: "4a074028-d72a-4954-a159-f41adeb5cc5b",
        link: "javascript:void(0)",
        imgurl: "/img/upload/png/joyacart_000002_12032019.png",
        text: 'Product 002',
        price: '99.00',
        hitRate: '25241',
        goldMedal: true,
        newItem: false,
        newShop: true,
        freeDelivery: true,
        ShopId: '10eb4250-47d6-41ad-a429-f65e05836f26'
        }]
}

html ниже: 

<div class="test"></div>

Ответы [ 2 ]

2 голосов
/ 01 августа 2020

Вы можете получить значение, которое меньше product, используя searchParams.get("product");, а затем передать то же самое в вашу функцию, чтобы получить требуемый текст.

Демо-код : 

//your json  data
var data = {
  productList: [{
      id: "62276197-6059-4c21-9b40-c5b1d277e85d",
      link: "javascript:void(0)",
      imgurl: "/img/upload/png/joyacart_000001_12032019.png",
      text: 'Product 001',
      price: '368.00',
      hitRate: '45472',
      goldMedal: false,
      newItem: true,
      newShop: true,
      freeDelivery: true,
      ShopId: '5cfb048c-86e8-4d2d-85bf-e4e9e1effdcb'
    },
    {
      id: "4a074028-d72a-4954-a159-f41adeb5cc5b",
      link: "javascript:void(0)",
      imgurl: "/img/upload/png/joyacart_000002_12032019.png",
      text: 'Product 002',
      price: '99.00',
      hitRate: '25241',
      goldMedal: true,
      newItem: false,
      newShop: true,
      freeDelivery: true,
      ShopId: '10eb4250-47d6-41ad-a429-f65e05836f26'
    }
  ]
}
//your url
var url_string = "http://www.example.com?product=62276197-6059-4c21-9b40-c5b1d277e85d";
var url = new URL(url_string);
//get product parameter value
var browserId = url.searchParams.get("product");
//checking if id is not null
if (browserId != null) {
  //pass id
  $('.test').append(productItemName(browserId))
}

function productItemName(productName) {
  return data.productList.filter(product => product.id === productName)?.[0]?.text;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="test"></div>
0 голосов
/ 01 августа 2020

в моей веб-консоли productItemName функция выдает ошибку из-за неправильного синтаксиса (имеется в виду ?.[0]?.text)

попробуйте это 

function productItemName(productName) {
    let result = data.productList.find((item) => item.id === productName);
    return result !== undefined ? result.text : "Not Found";
}
...