получить json данные из функции api, используя response.js

Question

Как я могу получить данные json из apiUrl? Нужна помощь в написании функции

changeUrl: function(evt){ 
     this.setState({ 
      value: evt.target.value, 
      apiUrl: "https://test.holmusk.com/food/search?q=" + evt.target.value 
     }); 
     }, 

     getJson: function() { 

     }, 

Answer 1

Ваш код немного сбивает с толку, потому что это трудно сказать, почему вы устанавливаете apiURL в SetState, когда я предполагаю, что вы должны вызвать этот URL, чтобы получить данные в формате JSON. Комментирующий делает хороший вывод о настройке архитектуры поиска данных с использованием библиотеки, такой как Redux. Однако, если вы хотите просто сделать Javascript-сообщение с простой ванилью, вы можете сделать что-то вроде ниже. Трудно сказать, нужен ли Json в состоянии вашего компонента, но я предполагаю, что вы это сделали, поэтому я переделал код с учетом этого предположения.

changeUrl: function(evt){ 
      getJson(evt.target.value); 
    }, 

    getJson: function(newVal) { 
     var request = new XMLHttpRequest(); 
     request.open('GET', "https://test.holmusk.com/food/search?q=" + newVal, true); 
      request.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');  
      //this callback gets called when the server responds to the ajax call    
      request.onreadystatechange = function(){ 
       if (request.readyState === 4 && request.status === 200){ 
        var returnedJson = JSON.parse(request.responseText); 
        //this is where you would want to run setState if you need the returned Json for it. 
        setState({newJson: returnedJson}); 
       } 
       else if (request.readyState === 4 && request.status !== 200){ 
        alert('error'); 
       }   
      };  
      request.send(); 
    }