Xstate: Transition to sub-state

[lmatteis]

Imagine I have this statechart:

const machine = Machine({
    initial: 'Init',
    states: {
        Init: {
            on: {
                FETCH_DATA_CLICKED: 'FetchingData',
            },
            initial: 'NoData',
            states: {
                ShowData: {},
                Error: {},
                NoData: {}
            }
        },
        FetchingData: {
            on: {
                FETCH_DATA_SUCCESS: 'ShowData',
                FETCH_DATA_FAILURE: 'Error',
                FETCH_DATA_CANCEL: 'NoData',
            },
            onEntry: 'FETCH_DATA_REQUEST',
        },
    }
});

When in FetchingData, is there a way to transition to a substate of Init?

Here's an example of what I'm trying to achieve:

[davidkpiano]

Sure, just configure it like:

// ...
  on: {
    FETCH_DATA_SUCCESS: 'Init.NoData'
  }
// ...

Hope that helps!