Bitrix Framework

Differences between Vuex versions are few, let's overview them in this article. You can find details on transitioning from earlier version to a newer at the official website.

List of updates:

1. Approach to storage creation has changed: now uses createStore({...}) instead new Store({...}).
2. Storage attribution changed: now uses the method .use(store) instead of variable store in Vue parameters.

Storage connection

Was:

import {Vue} from 'vue';
import {Vuex} from 'vuex';

const store = new Vuex.Store({
    ...
});

Vue.create({
	el: '#application',
    store: store,
	template: '<Component/>'
});

import {Vue} from 'ui.vue';
import {Vuex} from 'ui.vue.vuex';

const store = Vuex.createStore({
	...
});

Vue.create({
	el: '#application',
    store: store,
	template: '<Component/>'
});

Now:

import {BitrixVue} from 'ui.vue3';
import {createStore} from 'ui.vue3.vuex';

const store = createStore({
	...
});

const application = BitrixVue.createApp({
	template: '<Component/>'
})
application.use(store);
application.mount('#application');