javascript - 在 CycleJS 中使用输入字段值作为 HTTP 请求数据的一部分

Question

我正在尝试使用 CycleJS HTTP 驱动程序向 REST 端点发出请求，但我获取输入字段值的方式不是响应式的，但我无法找到一种方法来做它(正确的方式)

用户案例:

用户填写用户名和密码字段，然后点击“注册”，请求完成，输入字段作为数据。

但是如果我创建一个 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;
  }
});

我确实遗漏了一些东西，但找不到解决方案。

Answer 1

对我来说似乎有效

.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;
  });