Hi,
I’m trying to call Vuex-action from the component, and always getting:
vue.js?ver=2:634 [Vue warn]: Error in v-on handler: “TypeError: sub is not a function”
found in
—> [CabinetPersonal]
[CustomerCabinet]
[Root]
Vue.js ver. 2.6 (as you see upper), Vuex.js is 3.0.0
This is method of the component, that calls dispatch.
update_details() {
let customer = {
'first_name': this.first_name,
'last_name': this.last_name,
'email': this.email,
'phone': this.phone,
'address': this.address,
'vat': this.vat,
'company_name': this.company_name,
'supply_time': this.supply_time,
'comments': this.comments,
'approval_status': store.state.customer.approval_status,
'name': store.state.customer.name,
'user_status': store.state.customer.user_status,
}
//this.$store.commit('SET_CUSTOMER', customer);
this.$store.dispatch('updateCustomer', customer);
},
this.$store.commit works fine (if we remove the comments). That is, the store object itself is defined in the component.
I tried the simplest TEST method for vuex - synchronous and consisting of a single alert() operator - the error is the same.
But my testing action TEST is called normally from the main vue instance. And my real action ‘updateCustomer’ is also called well from vue instance.
So I assume the error is in the interaction between the component and vuex, no other ideas.
I’m not using npm, babel etc.
Vue.use(Vuex);
const store = new Vuex.Store({
state: {
customerId: null,
customer: {},
pushproducts: {},
products: {},
idcart: {},
},
actions: {
TEST(commit, payload) {
alert(payload)
},
updateCustomer: async ({commit}, customer) => {
commit('SET_CUSTOMER', customer)
let userData = {
customerId: commit.customer_id,
first_name: customer.first_name,
last_name: customer.last_name,
address: customer.address,
email: customer.email,
phone: customer.phone,
vat: customer.vat,
company_name: customer.company_name,
comments: customer.comments,
supply_time: customer.supply_time,
}
let data = {
action: 'customer_update_details',
security: ajax_php_vars.nonce,
userData: userData,
}
const {answer} = await $.ajax({
type: 'post',
url: ajax_php_vars.ajax_url,
action: 'customer_update_details',
data: data,
success: function (data) {
//response = JSON.parse(data);
alert('Your data is securely stored!');
},
error: function (err) {
console.log(err);
}
});
},
I would be very grateful for hints/help on how to solve the issue. Stuck on it…
