首页 > 解决方案 > Vuex - axios Post 给出不同的错误

问题描述

我正在尝试将列表发布到服务器并期望它从服务器返回过滤后的数据。我有两个组件。在第一个组件中,我有一个按钮。当我单击它时,它会向服务器发送一个请求,并使第二个组件在按钮下方可见。在第二个组件中,有一个 v-datatable。在第二个组件中,我试图访问从服务器返回的列表,但它给出了错误。

单击按钮时的一些错误

组件一

...
<v-btn
     class="ma-2"
     outlined
     color="red"
     @click="SET_HANDLER()">LIST()
</v-btn>
</v-row>
      </v-container>      
  </v-form>
    <SecondComponentDataTable v-if="showDT==true"></SecondComponentDataTable>
</div>

脚本部分:

<script>
  import axios from 'axios'
  import SecondComponentDataTable from '@/components/SecondComponentDataTable'

export default {
    components:{
        SecondComponentDataTable 
    },
    methods:{
        SET_HANDLER()
        {
            this.showDT=true;
            this.$store.dispatch('getPosts',this.entity)
        },

第二组件数据表:

<template>
  <v-data-table
            :items="inspection"
         ...
<script>
  import {  mapState } from "vuex";

export default {    
    
    computed:mapState([
        'inspection'
    ]),   
}
</script>

我想提一下,在分离存储文件之前我从未遇到过错误。

这是位于 store/modules/ 的inspectionReview.js Storefile

import axios from 'axios'

const state={
    inspection:[]    
}

const actions = {
    getPosts ({ commit },payload) {
        axios.post('https://localhost:44377/Dossier/GetFiltered',payload)
            .then(r => r.data)
            .then(inspection=> {
            commit('SET_FILTERED', inspection)
          })
      }    
}
const mutations = 
{    
    SET_FILTERED(state, inspection) {
        state.inspection= inspection;
      },
}
export default {
    state,
    actions,
    mutations,
    
  }

这是位于 store/index.js 的 Index.js(通用商店文件)

import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
import inspectionReview from "./modules/inspectionReview";

Vue.use(Vuex)

export default new Vuex.Store({
  state: { 
    }, 
  
    mutations: {
     
  },
  actions: {
    
  },
  modules: {
    inspectionReview
  }
})

检查清单如下所示:

"id": "3fa85f64-5717-4562-b3fc-2c963f66afa6",
  "openingTypeId": 0,
  "sourceId": 0,
  "institutionTypeId": 0,
  "resultId": 0,
  "linkedUnit": "string",
  "linkedUnitId": 0,
  "complaintSubjectId": 0,
  "dossierYearId": 0,
  "dossierNumber": "string",
  "dossierName": "string",
  "cityId": 0,
  "description": "string",
  "createdAt": "2021-07-29T08:22:56.642Z",
  "createdBy": "string",
  "modifiedAt": "2021-07-29T08:22:56.642Z",
  "modifiedBy": "string",
  "deletedAt": "2021-07-29T08:22:56.642Z",
  "deletedBy": "string",
  "isInUse": true
}

标签: vue.jsvuejs2vuetify.jsvuex

解决方案


推荐阅读