在 CycleJS 中使用输入字段值作为 HTTP 请求数据的一部分
Use input field values as part of the data of the HTTP request in CycleJS
我正在尝试使用 CycleJS HTTP 驱动程序向 REST 端点发出请求,但我获取输入字段值的方式不是反应式的,但我找不到方法去做(正确的方式)
用户案例:
用户填写用户名和密码字段,然后单击 "Sign up",请求完成,输入字段作为数据。
但是如果我创建了一个 xs-stream 字段,则永远不会为 HTTP 请求设置值。
所以我最后做的是:
.select('.btn-signup').events('click')
.map( ev => {
let request = API.requestCreate;
// TODO - search for the best way to use the values.
var user = document.querySelector('.user-input').value;
var pass = document.querySelector('.user-password').value;
if(user && pass ) {
request.send = { username:user, password: pass };
return request;
}
});
我确实遗漏了一些东西,但找不到解决方案。
对我来说似乎有效
.select('.btn-signup').events('click')
.map( ev => ({
username: document.querySelector('.user-input').value,
password: document.querySelector('.user-password').value
})
.filter(data => data.username && data.password)
.map(data => {
const request = API.requestCreate;
request.send = data;
return request;
});
或者:
const username$ = .select('.btn-signup')
.events('.user-input')
.map(e => e.target.value);
const password$ = .select('.btn-signup')
.events('.user-input')
.map(e => e.target.value)
.select('.btn-signup')
.events('click')
.withLatestFrom(
username$,
password$,
(username, password) => ({username, password})
)
.filter(data => data.username && data.password)
.map(data => {
const request = API.requestCreate;
request.send = data;
return request;
});
我正在尝试使用 CycleJS HTTP 驱动程序向 REST 端点发出请求,但我获取输入字段值的方式不是反应式的,但我找不到方法去做(正确的方式)
用户案例:
用户填写用户名和密码字段,然后单击 "Sign up",请求完成,输入字段作为数据。
但是如果我创建了一个 xs-stream 字段,则永远不会为 HTTP 请求设置值。
所以我最后做的是:
.select('.btn-signup').events('click')
.map( ev => {
let request = API.requestCreate;
// TODO - search for the best way to use the values.
var user = document.querySelector('.user-input').value;
var pass = document.querySelector('.user-password').value;
if(user && pass ) {
request.send = { username:user, password: pass };
return request;
}
});
我确实遗漏了一些东西,但找不到解决方案。
对我来说似乎有效
.select('.btn-signup').events('click')
.map( ev => ({
username: document.querySelector('.user-input').value,
password: document.querySelector('.user-password').value
})
.filter(data => data.username && data.password)
.map(data => {
const request = API.requestCreate;
request.send = data;
return request;
});
或者:
const username$ = .select('.btn-signup')
.events('.user-input')
.map(e => e.target.value);
const password$ = .select('.btn-signup')
.events('.user-input')
.map(e => e.target.value)
.select('.btn-signup')
.events('click')
.withLatestFrom(
username$,
password$,
(username, password) => ({username, password})
)
.filter(data => data.username && data.password)
.map(data => {
const request = API.requestCreate;
request.send = data;
return request;
});