Vuex 和 mysql 连接对象:不要在突变处理程序之外改变 vuex 存储状态
Vuex and mysql connection object: Do not mutate vuex store state outside mutation handlers
我有一个使用 mysql 包直接连接到我的数据库的电子应用程序。我想要做的是将使用 mysql.createConnection()
创建的 connection
对象存储在 Vuex 状态中。然后我想使用这个对象从数据库中获取一些数字。
我得到了 Vuex 商店的代码:
const state = {
connectionObject: null,
numbers: [],
};
const getters = {
getNumbers: state => state.numbers,
getConnectionObject: state => state.connectionObject,
};
const mutations = {
SET_NUMBERS(state, numbers) {
state.numbers = Object.assign({}, numbers);
},
SET_CONNECTION_OBJECT(state, connection) {
state.connectionObject = connection;
},
};
const actions = {
fetchNumbers({ state, commit }) {
const connection = _.cloneDeep(state.connectionObject);
connection.query({
sql: 'SELECT * FROM `numbers`',
timeout: 40000,
}, async (error, results) => {
if (error instanceof Error) {
throw new Error(error);
}
commit('SET_NUMBERS', await results);
});
},
connectToDatabase({ commit }, data) {
const connection = mysql.createConnection(data);
return new Promise((resolve, reject) => {
connection.connect(async (err) => {
if (err) {
return reject(err);
}
commit('SET_CONNECTION_OBJECT', await connection);
commit('SET_DB_CONNECTION_STATE', data);
return resolve(connection);
});
});
},
};
一旦我 运行 我得到 Error in callback for watcher "function () { return this._data.$$state }": "Error: [vuex] Do not mutate vuex store state outside mutation handlers."
的代码,当执行 connection.query()
时抛出这个错误。
我很难理解为什么它在我从 state 克隆 connectionObject
时不起作用。它的观察者似乎也被克隆了。有办法避免吗?
连接对象高度可变,无法存储。您建立的每个连接都会更改连接对象的属性。我只会将 returns 存储在存储中,操作中的数据更新和 connectionobject 应该可以跨 vuex 访问,但要注意将其设为全局,这会使您的应用程序更容易被破解。使其可访问的一种方法是简单地将其声明为状态之外的变量。
如果您需要进一步的建议,最好知道您使用了哪个 SQL 包以便为您提供一些代码。
我有一个使用 mysql 包直接连接到我的数据库的电子应用程序。我想要做的是将使用 mysql.createConnection()
创建的 connection
对象存储在 Vuex 状态中。然后我想使用这个对象从数据库中获取一些数字。
我得到了 Vuex 商店的代码:
const state = {
connectionObject: null,
numbers: [],
};
const getters = {
getNumbers: state => state.numbers,
getConnectionObject: state => state.connectionObject,
};
const mutations = {
SET_NUMBERS(state, numbers) {
state.numbers = Object.assign({}, numbers);
},
SET_CONNECTION_OBJECT(state, connection) {
state.connectionObject = connection;
},
};
const actions = {
fetchNumbers({ state, commit }) {
const connection = _.cloneDeep(state.connectionObject);
connection.query({
sql: 'SELECT * FROM `numbers`',
timeout: 40000,
}, async (error, results) => {
if (error instanceof Error) {
throw new Error(error);
}
commit('SET_NUMBERS', await results);
});
},
connectToDatabase({ commit }, data) {
const connection = mysql.createConnection(data);
return new Promise((resolve, reject) => {
connection.connect(async (err) => {
if (err) {
return reject(err);
}
commit('SET_CONNECTION_OBJECT', await connection);
commit('SET_DB_CONNECTION_STATE', data);
return resolve(connection);
});
});
},
};
一旦我 运行 我得到 Error in callback for watcher "function () { return this._data.$$state }": "Error: [vuex] Do not mutate vuex store state outside mutation handlers."
的代码,当执行 connection.query()
时抛出这个错误。
我很难理解为什么它在我从 state 克隆 connectionObject
时不起作用。它的观察者似乎也被克隆了。有办法避免吗?
连接对象高度可变,无法存储。您建立的每个连接都会更改连接对象的属性。我只会将 returns 存储在存储中,操作中的数据更新和 connectionobject 应该可以跨 vuex 访问,但要注意将其设为全局,这会使您的应用程序更容易被破解。使其可访问的一种方法是简单地将其声明为状态之外的变量。
如果您需要进一步的建议,最好知道您使用了哪个 SQL 包以便为您提供一些代码。