Vuex

You can use Vike with Vuex.

This page documents how to manually integrate Vuex.

There isn't a Vike extension for Vuex yet, but contribution welcome to create one.

Initial state

When using a store such as Vuex, your components don't access fetched data directly: your components only access the store.

Integration example:

  1. Initialize Vuex with app.use() inside onCreateApp().
  2. Get the initial SSR state of the store and make it available as pageContext.initialStoreState.

    For example in onAfterRenderHtml(), or onRenderHtml() if you don't use vike-react/vike-vue/vike-solid.

    See also: API > pageContext > Custom.

  3. Make pageContext.initialStoreState available on the client-side.

    See API > passToClient.

  4. Initialize Vuex on the client-side with pageContext.initialStoreState.

    For example in onBeforeRenderClient(), or onRenderClient() if you don't use vike-react/vike-vue/vike-solid.

See also:

Example

See also