Как мне запустить XHR на компоненте MouseClick, используя CalmmJS и React?
Что я хочу, чтобы вызвать XHR.perform
onMouseClick, используя CalmmJS и React - я пытаюсь следующий код, ненужные части отредактированы:
const getResults = someArg => XHR.perform({
timeout: 60 * 1000,
responseType: 'json',
method: 'POST',
url: U.string`/api/${ facet }/end-point/`,
body: U.stringify( someArg )
});
...
<SomeElement
...
onMouseClick={ U.ifElse(
shouldMakeXHR, /* Atom that runs its own debounced XHR checks, then
runs it through an R.equals to see if the result
is acceptable - result is either true or false */
_ => getResults( someArg ),
R.identity //as no-op
) }
/>
В настоящее время я просто пытаюсь инициировать сетевой запрос, ничего не делая с результатом. Вместо XHR.perform
просто проглатывается без следа. Что я делаю неправильно?
PS: Пожалуйста, кто-то может пометить мой пост с помощью karet или karet.util, так как я не могу создавать теги. Спасибо за любую помощь!
1 ответ
Это еще один основной вопрос, против которого я почему-то продолжал биться головой.
Ответ не в том, чтобы использовать обычную функцию, а в том, чтобы воспользоваться karet.util
библиотека и U.doPush
значение для U.bus()
поток. Официальная документация CalmmJS на самом деле указывает на действительно ясный и простой пример, демонстрирующий это поведение. U.doSet
значение для обычного U.atom()
, хотя я начинаю думать, что должен быть лучший способ... обновлю этот ответ, если найду его.
Существует лучший способ! Прямо от Весы Карвонен /@polytypic сам:
const requestsBus = U.bus()
const xhrProperty = XHR.perform(U.toProperty(requestsBus))
<button
onClick={U.doPush(requestsBus, {
timeout: 60 * 1000,
responseType: 'json',
method: 'POST',
url: U.string`/api/${ facet }/end-point/`,
body: U.stringify( someArg )
})}>
Request!
</button>
Вот оригинальный почти рабочий код для потомков - НЕ ИСПОЛЬЗУЙТЕ КОД НИЖЕ ЭТОЙ ЛИНИИ - СМОТРИТЕ ВЫШЕ
const mouseClick = U.atom( false );
const makeRequest = someArg => XHR.perform({
timeout: 60 * 1000,
responseType: 'json',
method: 'POST',
url: U.string`/api/${ facet }/end-point/`,
body: U.stringify( someArg )
});
const getResponse = U.when( mouseClick,
XHR.responseFull( makeRequest( someArg ) );
...
<p>{ U.stringify( getResponse ) }</p>
<SomeElement
...
onClick={ U.ifElse(
shouldMakeXHR, /* Atom that runs its own debounced XHR checks, then
runs it through an R.equals to see if the result
is acceptable - result is either true or false */
U.doPush( mouseClick, true ),
R.identity //as no-op
) }
/>
Обратите внимание, что это будет продолжать отправлять запросы XHR после каждого изменения ArArg после первого щелчка мышью.