Обработка ajax с помощью React

Как мне обрабатывать запросы ajax в довольно традиционном веб-приложении? В частности, с использованием React для представлений, имея бэкэнд, который обрабатывает данные, такие как текст, а что нет, но используя ajax для автоматического сохранения пользовательских взаимодействий, таких как переключение параметров или симпатия к сообщению на сервер.Обработка ajax с помощью React

Должен ли я просто использовать jQuery для этого, или что-то вроде Backbone будет более полезным?

источник

2015-05-01 user2442241

Взгляните на поток и, как люди обработки AJAX там: http://stackoverflow.com/questions/ 26632415/where-should-ajax-request-be-made-in-flux-app – DesignerGuy

Вы можете использовать любой из них. Тебе решать. Если у вас уже есть запасной материал, вы можете продолжать его использовать. –

Я использую jQuery, чтобы использовать вызов AJAX с помощью React с Django Backend. – PythonIsGreat

На всякий случай кто-то наткнулся на это и не знает, что jQuery упрощает отправку вызовов AJAX. Поскольку React - это просто JavaScript, он будет работать так же, как и любой другой вызов JQuery AJAX.

Собственная документация React использует jQuery для вызова AJAX, поэтому я предполагаю, что это достаточно хорошо для большинства целей независимо от того, существует ли стек или стек.

componentDidMount: function() { 
    $.ajax({ 
     url: this.props.url, 
     dataType: 'json', 
     cache: false, 
     success: function(data) { 
     this.setState({data: data}); 
     }.bind(this), 
     error: function(xhr, status, err) { 
     console.error(this.props.url, status, err.toString()); 
     }.bind(this) 
    }); 
    },

источник

2015-05-01 19:06:16 PythonIsGreat

+13

Это огромная библиотека, которая тянет только для обертки AJAX. Сжатая версия 2.x, которую они загружают, составляет 82 КБ. Это очень много для обертки, которая, вероятно, может быть написана с несколькими достаточными кодонами, чтобы поместиться на экране. – ivarni

Да, вы правы в этом, но есть еще так много, что я использую jQuery для, помимо всего лишь вызова Ajax. Это боль, чтобы загрузить его с помощью React, но jQuery по-прежнему слишком полезен для меня, чтобы полностью избавиться. – PythonIsGreat

На тему огромного jquery: альтернативы включают суперагент и reqwest. Оба они имеют очень похожие API, но суперагент только 10 кБ по сравнению. –

Я бы не использовать JQuery, так как AJAX звонки на самом деле не так сложна и JQuery является довольно большой зависимостью. См. Примечание Vanillajs о выполнении вызовов AJAX без библиотек: http://vanilla-js.com/

источник

2015-05-01 22:52:33

Использование 'jQuery' не рекомендуется, я предпочитаю использовать' fetch'. – AmerllicA

Действительно. 'Fetch' - это в настоящее время решение goto для выполнения HTTP-запросов. –

Вы можете использовать API JavaScript Fetch, он также поддерживает GET и POST, а также имеет большие обещания.

fetch('/api/getSomething').then(function() {...})

источник

2016-03-19 16:20:46

Как вы справляетесь с отменой запроса на рейс? –

В настоящее время это не очень хороший вариант для реагирования на родной язык: http://caniuse.com/#feat=fetch – circuitry

Конечно, вы можете использовать fetch с React Native (я делаю) Указанная вами ссылка показывает совместимость браузера. React не является браузером (гибридной) технологией, поэтому вы можете просто включить выборку через npm. – Plaul

Просьба оформить официальную документацию Facebook о Complementary Tools на https://github.com/facebook/react/wiki/Complementary-Tools

Они просто рекомендует несколько выборки данных API, как

superagent: Легкий "изоморфными" библиотеки для AJAX запросов.
reqwest: AJAX сначала. Включает поддержку xmlHttpRequest, JSONP, CORS и CommonJS Promises A. Поддержка браузера продолжается до IE6.
react-ajax: Ajax Request Component for React.
axios: Клиент HTTP на основе Promise для браузера и node.js.

Мой личный фаворит будет axios из-за обещаний, которые работают в браузере, а также nodejs env.

источник

2016-04-14 10:14:38

Использование 'response-ajax' смешно, я не могу его найти, я предпочитаю использовать' fetch' и использовать 'async/await' для лучшего понимания и свободного кодирования. – AmerllicA

Я определенно предлагаю вам использовать Fetch API. Это очень просто понять, поддерживает все методы, и вы можете использовать async/await вместо promise/then и перезвонить ад.

Например:

fetch(`https://httpbin.org/get`,{ 
    method: `GET`, 
    headers: { 
     'authorization': 'BaseAuth W1lcmxsa=' 
    } 
}).then((res)=>{ 
    if(res.ok) { 
     return res.json(); 
    } 
}).then((res)=>{ 
    console.log(res); // It is like final answer of XHR or jQuery Ajax 
})

В лучшую сторону или async/await образом:

(async function fetchAsync() { 
    let data = await (await fetch(`https://httpbin.org/get`,{ 
           method: `GET`, 
           headers: { 
            'authorization': 'BaseAuth W1lcmxsa=' 
           } 
          })).json(); 
         console.log(data); 
})();

источник

2017-12-26 18:11:19 AmerllicA

Обработка ajax с помощью React

ответ

Смежные вопросы