Переходный переход, который устанавливает значение только при прохождении условия

Question

Возьмите следующий код:

const isWarning = () => { ... }
const setWarning = () => { ... }

const machine = Machine({
  initial: "foo",
  context: {
    warning: null
  },
  states: {
    foo: {
      on: {
        "": [
          target: "bar",
          action: "setWarning",
          cond: "isWarning",
        ]
      }
    },
    bar: {
      on: {
        FOO: "foo,
      }
    }
  }
}, {
  actions: {
    setWarning
  }
  guards: {
    isWarning
  }
});

Это лучший способ перейти к "bar" и установить предупреждение на основе некоторых количественных данных в "foo"?

Answer 1

Учитывая опубликованный пример кода, я не уверен, что вы подразумеваете под "количественными данными в foo". Данные, относящиеся к поведению машины, могут храниться вcontext или государства metaсвойство. Для попадания вbarсостояние и установите предупреждение, вам может понадобиться что-то вроде:

    const sm = Machine({
      initial: 'baz',
      context: { wasWarned: false },
      on: {
        'WARNING': {
            target: 'bar',
            action: 'setWarning'     
        }
      },
      states: {
        baz: {},
        bar: {}
      }  
    }, {
      actions: {
        setWarning: assign({ warning: true })
      }
    })

Это означает: когда машина получает событие "ПРЕДУПРЕЖДЕНИЕ", перейдите в barсостояние И немедленно, прежде чем что-либо еще обновить контекст.

Действия запускаются не сразу. Вместо этого объект State, возвращенный из machine.transition (...), декларативно предоставит массив.actions что интерпретатор может затем выполнить.

Переход будет включен после того, как будут приняты охранники.

Другой пример кода, который может оказаться полезным в зависимости от того, чего вы хотите достичь:

const sm = Machine({
      initial: 'pending',
      context: { wasWarned: null },
      states: {
        pending: {
          on: {
            '': [
             {target: 'bar', cond:'wasWarned'},
             {target: 'baz', cond: 'otherCond'} 
            ]
          }
        },
        bar: {},
        baz: {}
      },
      guards: {
        wasWarned: (ctx) => ctx.wasWarned
      }
    })