Получение случайного результата при поиске по API

#javascript #reactjs

#javascript #reactjs

Вопрос:

У меня есть простое приложение, которое извлекает шутки с помощью icanhazdadjoke API. Существует обработчик событий поиска, который извлекает шутки в соответствии с параметром limit с значением по умолчанию 15. Также есть кнопка рандомизации, которая вызывает метод поиска с ограничением, установленным на 1. Однако при каждом нажатии кнопки рандомизации появляется один и тот же результат — как я могу вместо этого получить случайный одиночный результат поиска?

Вот мой обработчик поиска:

   // Default parameter
  getJokes(limit = 15) {
    this.setState({ isFetchingJokes: true });

    fetch(
      `https://icanhazdadjoke.com/search?term=${
        this.state.searchTerm
      }amp;limit=${limit}`,
      {
        method: 'GET',
        headers: {
          Accept: 'application/json'
        }
    })
      .then(response => response.json())
      .then(json => {
        const jokes = json.results;
        this.setState({
          jokes,
          isFetchingJokes: false
        })
      });
  };
  

При нажатии кнопки рандомизации вызывается обработчик поиска с ограничением 1 (он передается как реквизит для отображаемого компонента, который из другого файла : onRandomize={() => this.getJokes(1)} )

Полный код: App.js
retrieval-form.js

Комментарии:

1. Возможно, это не проблема в вашем коде, это то, как работает API, для одного и того же поискового запроса он возвращает те же результаты, поэтому, если вы запрашиваете always 1, он всегда возвращает то же самое. Вы можете имитировать рандомизацию, запросив 10 или 20, а затем получить один случайным образом.

2. Я согласен с Ф.Берналом, судя по документации API, вы получаете случайную шутку только при вызове API без поискового запроса

Ответ №1:

Вы можете получить рандомизированный одиночный результат двумя способами

  1. Вы должны рандомизировать результат в серверной части, а затем ограничить до 1.

2.By использование функции, которая устанавливает случайное значение из массива

  randomJoke(arr) {
    var joke = arr[Math.floor(Math.random()*arr.length)];
    this.setState({jokes: [joke] });
 }
  

Ответ №2:

С запросом api вы не можете не получить весь массив, и вы выбираете random с помощью этого кода

 var joke = jokes[Math.floor(Math.random()*jokes.length)];