没有 Vue 可以使用 Vuex 吗? (Vuex 服务器端?)

Is it possible to use Vuex without Vue? (Vuex server-side?)

Vuex 抱怨如果不调用 Vue.use(Vuex) 就无法创建商店的新实例。虽然这通常没问题,但我正在摆弄使用同一商店编写 backend/frontend 的想法。有人知道答案吗?

谢谢。

TL;DR you can perfectly use Vuex in node (without a browser), even for unit testing. Internally, though, Vuex still uses some code from Vue.

没有 Vue 就无法使用 Vuex。因为:

也就是说,您确实需要 Vue,但是您不需要 Vue 实例。您甚至不需要浏览器。

所以是的,它在 server-side 中非常有用,独立。

例如,您可以 运行 使用 Node.js 如下:

  • 创建示例项目:

    npm init -y
    
  • 安装依赖项(注意:axios不是必需的,我们只是为了这个演示添加它):

    npm install --save vue vuex axios
    
  • 创建脚本(index.js):

    const axios = require('axios');
    const Vue = require('vue');
    const Vuex = require('vuex');
    Vue.use(Vuex);
    
    const store = new Vuex.Store({
      strict: true,
      state: {name: "John"},
      mutations: {
        changeName(state, data) {
            state.name = data
        }
      },
      actions: {
        fetchRandomName({ commit }) {
          let randomId = Math.floor(Math.random() * 12) + 1  ;
          return axios.get("https://reqres.in/api/users/" + randomId).then(response => {
            commit('changeName', response.data.data.first_name)
          })
        }
      },
      getters: {
        getName: state => state.name,
        getTransformedName: (state) => (upperOrLower) => {
          return upperOrLower ? state.name.toUpperCase() : state.name.toLowerCase()
        }
      }
    });
    console.log('via regular getter:', store.getters.getName);
    console.log('via method-style getter:', store.getters.getTransformedName(true));
    
    store.commit('changeName', 'Charles');
    console.log('after commit:', store.getters.getName);
    
    store.dispatch('fetchRandomName').then(() => {
        console.log('after fetch:', store.getters.getName);
    });
    
  • 运行它:

    node index.js
    
  • 它会输出:

    via regular getter: John
    via method-style getter: JOHN
    after commit: Charles
    after fetch: Byron