Есть ли способ иметь защищенные переходы внутри узлов иерархического состояния в xState

Question

Как видно из заголовка, у меня есть защищенные переходы, которые я хотел бы видеть в узле иерархического состояния, однако кажется, что xState не может прочитать свойство охранников и возвращает "TypeError: Cannot read property 'propertyName' of undefined" error"

Есть ли способ сделать это в xState, или я должен продолжить без иерархического State State в этом случае

Answer 1

Именно поэтому у меня возникла проблема с тем, что у меня был контекст, назначенный моему иерархическому конечному автомату вместо родительского, поэтому охранники не могли получить к нему доступ. Перемещение контекста на родительский компьютер решило проблему

Answer 2

Я использовал иерархический конечный автомат пример из документов, чтобы попытаться смоделировать это, добавив следующее в хвостовой части примера:

    on: {
      POWER_OUTAGE: '.red.blinking',
      POWER_RESTORED: '.red',
      POWER_TEST: {
        target: '.red.stop',
        cond: {
          type: 'test'
        }
      }
    }
  },{
    guards: {
      test: () => true
    }
  });

Кажется, это работает как ожидается, что вы можете попробовать этот пример машины и охранника в визуализаторе здесь

Вы можете перевернуть логическое значение в тестовом гвардии, чтобы поиграть с ним, работающим / не работающим.

А вот полный код примера для справки:

const pedestrianStates = {
    initial: 'walk',
    states: {
      walk: {
        on: {
          PED_COUNTDOWN: 'wait'
        }
      },
      wait: {
        on: {
          PED_COUNTDOWN: 'stop'
        }
      },
      stop: {},
      blinking: {}
    }
  };

  const lightMachine = Machine({
    key: 'light',
    initial: 'green',
    states: {
      green: {
        on: {
          TIMER: 'yellow'
        }
      },
      yellow: {
        on: {
          TIMER: 'red'
        }
      },
      red: {
        on: {
          TIMER: {
            target: 'green',
            cond: {
              type: 'searchValid'
            }
          }
        },
        ...pedestrianStates
      }
    },
    on: {
      POWER_OUTAGE: '.red.blinking',
      POWER_RESTORED: '.red',
      POWER_TEST: {
        target: '.red.stop',
        cond: {
          type: 'test'
        }
      }
    }
  },{
    guards: {
      test: () => true
    }
  });