问题:执行设置函数期间未处理的错误和执行调度程序刷新期间未处理的错误

问题描述 投票:0回答:0

我有一个组件 UserView:

<template>
<div>
  <div class="text-center w-full text-xl text-green-700" v-if="isLoading">
    Loading...
  </div>

  <div class="text-center w-full text-xl text-red-700" v-if="error">Something was happened</div>

  <div v-if="users" class="w-full mt-5  overflow-x-auto">
      <table class="w-1/2 text-sm ml-auto mr-auto text-center text-gray-500">
        <thead class="text-xs text-gray-700 uppercase bg-gray-50">
        <tr>

          <th scope="col" class="px-3 py-1.5">
          FirstName
          </th>

          <th scope="col" class="px-3 py-1.5">
           Email
          </th>

          <th scope="col" class="px-3 py-1.5">
            Phone Number
          </th>

          <th scope="col" class="px-3 py-1.5">
            Events Count
          </th>

          <th scope="col" class="px-3 py-1.5">
            Next Event Date
          </th>

        </tr>
        </thead>

        <tbody>
        <tr class="bg-white border-b" v-for="(user) in users">
          <td>
            <router-link class="hover:font-medium" :to="{name:'editUser',params:{id:user._id}}">
            {{user.firstName}}
            </router-link>

          </td>
          <td>{{user.email}}</td>
          <td>{{user.phoneNumber}}</td>
          <td>{{user.eventsCount}}</td>
          <td v-if="user.eventsCount>0">{{user.events[0].startDate.slice(0,10) }}</td>
          <td v-if="user.eventsCount==0"></td>
        </tr>
        </tbody>

      </table>

  <pagination-view :currentPage="currentpage" class="break-normal" :total="users.at(-1)" :limit="limit" :url="url"></pagination-view>
  </div>

</div>
</template>

<script>
import {actionTypes} from "@/store/modules/users";
import {mapState} from "vuex";
 import PaginationView from "@/components/PaginationView.vue";
import {data} from "autoprefixer";

export default {
  name: "UserView",
  data(){
    return{
      total:12,
      limit:1,
      currentpage:1,
      url:'/'
    }
  },
   components: {PaginationView},
  props:{
    apiUrl:{
    type:String,
    required:true
    }
  },
  computed:{
    data() {
      return data
    },
...mapState({
  isLoading:state =>state.users.isLoading,
  users:state => state.users.data,
  error:state => state.users.error
})
  },



   mounted(){
    this.$store.dispatch(actionTypes.getUsers,{apiUrl: this.apiUrl})
  }
}
</script>

<style scoped>

</style>

路由器链接有问题,因为他尝试执行异步操作并收到未定义的消息。

问题描述:

第一:

** 设置函数执行期间未处理的错误**

第二个:

** 调度程序刷新执行期间未处理的错误。这可能是一个 Vue 内部错误。 **

第三:

** 未捕获(承诺)错误:缺少必需的参数“id”**

我试图用循环和模板怀疑路由器链接,tr

vue.js vue-component vuejs3 vuex vue-router
© www.soinside.com 2019 - 2024. All rights reserved.