Question

我在我的应用程序中使用RiotJS和RiotControl在基于步骤的表单之旅中进行组件和事件处理。其中一个表单屏幕主要收集到两个商店的数据。在旧货币中，我将其称为多模型视图，并使用Rails之类的视图模型处理此问题。屏幕收集有关客户的信息以及有关实际旅程的信息，因此在提交表单时会将两个不同的问题发送到两个不同的商店。

// Store Examples

function customerDetails() {

  riot.observable(this);

  this.customer = {firstName: undefined, lastName: undefined}

  this.on('form-step:submitted', function(answers){
    this.customer.firstName = answers.firstName,
    this.customer.lastName = answers.lastName

    RiotControl.trigger('customerDetails:updated', this.customer);
  })
}

function surveyDetails() {

  riot.observable(this);

  this.survey = {questionOne: undefined, questionTwo: undefined}

  this.on('form-step:submitted', function(answers){
    this.survey.questionOne = answers.questionOne,
    this.survey.questionTwo = answers.questionTwo

    RiotControl.trigger('surveyDetails:updated', this.customer);
  })
}

// In main code

nextScreen.on('surveyDetails:updated customerDetails:updated', function(details){

  // I care about both of these events, but only want to execute 
  // this code once I've received the details from both stores. 

})

下一个表单屏幕需要在呈现之前来自两个商店的信息，所以我很难看到我如何确保在安装和呈现此屏幕之前触发了来自两个商店的更新事件，同时保持数据来自每个商店的事件处理程序的后续触发器。这样的事情是可能的，还是我以错误的方式解决这个问题？

非常感谢

Answer 1

可能你需要你现在所处步骤的状态（我认为一个好地方将是这些组件的父级）。

例如，customerDetails：updated会将currentStep更新为1，然后surveyDetails：updated会将currentStep更新为2。然后在nextScreen.on中，检查您的步骤，然后转到下一步。

RiotControl从多个商店触发操作

1 个答案: