Uncaught (in promise) TypeError: Cannot use 'in' operator to search for 'validateStatus' in

Viewed 18085

I am getting ** Uncaught (in promise) TypeError: Cannot use 'in' operator to search for 'validateStatus' in 5f8425a33a14f026f80133ed** where 5f8425a33a14f026f80133ed is the id passed to the axios url

I want to display the services based on the user id. My url works perfectly in postman but when i access it from the veux store it gives an error.

services.js (store)

import axios from 'axios';

const state = {
    services : {},
    status: '',
    error: null
};

const getters = {
    services : state => { return state.services }
};

const actions = {
      async fetchServices({commit}, userId) {
        let res = await axios.get('http://localhost:5000/api/services/displayUser' , userId)
        commit('setProducts', res.data)
        return res;          
    }
};

const mutations = {
    setProducts (state, items) {
        state.services= items
    },
};

export default {
    state,
    actions,
    mutations,
    getters
};

This is how I am calling the action :

computed: {
      ...mapGetters(["services"]),
    }, 
  methods: {
    ...mapActions(["fetchServices"]),
    getData(){
      this.fetchServices(this.user._id)
    },
  },
    async created() {
      await this.getProfile();
      await this.getData();
    }

The axios route is defined as

router.get('/displayUser', (req,res) => {
    const query = user =  req.body ;
    Services.find(query)
        .exec((err, services) => res.json(services))
})

the error screenshot :

Error screenshot

3 Answers

GET request should not have a body. Either use query params, indicate an id in a path, or use POST request. In case of query params this may look like this:

let res = await axios.get('http://localhost:5000/api/services/displayUser' , { params: { userId })
router.get('/displayUser', (req,res) => {
    const query = user =  req.query;
    Services.find(query)
        .exec((err, services) => res.json(services))
})

This worked for me too:

In front end: Vue Js

let res = axios.get("http://localhost:3000/api/v1/role/getRoleByName", 
{ params: { roleName: "name of role you want to send as params" },
});

In back end: Node Js

router.get('/getRoleByName', (req,res)=>{
  let roleName = req.query.roleName;
  roleModule.getRoleByName(roleName).then(data =>{
    response.json(res,data)
  }
    ).catch(err=> {
      response.badRequest(res, err);
    })
});

it's a silly mistake axios.post req.

async addTodo({ commit }, title) {
      try {
        const res = await axios.post(BASE_URL, { title, complete: false });
        commit("newTodo", res.data);
      } catch (err) {
        console.log(err.message);
      }
    },
Related