时间戳

首页 > 解决方案 > Vue.js：点击处理程序

vue.js - Vue.js：点击处理程序

问题描述

<paginate v-model="page" :page-count="pageCount" :container-class="'pagination'" :click-handler="clickCallback(page)" prev-text="‹" next-text="›"></paginate>

...
data: {
    page: 1
},
methods: {
    clickCallback: async function(page) {
    ...
  }
...

当我单击分页块中的页面时，会发生错误：

[Vue 警告]：无效的道具：道具“clickHandler”的类型检查失败。预期功能，得到承诺。

如何处理？

标签： vue.jspaginationasync-await

解决方案

该属性不接受 Promises - 仅接受同步函数。要么将异步函数包装在同步包装器中，要么将函数的异步部分放入另一个函数中：

<paginate v-model="page" :page-count="pageCount" 
  :container-class="'pagination'" 
  :click-handler="clickCallback(page)" prev-text="‹" next-text="›">
</paginate>

...
data: {
    page: 1
},
methods: {
    clickCallback: function(page) {
    ...
    this.asyncFunction(param1,....);
    ...
  }
  asyncFunction: async function(p1) 
  { 
    ...
  }
...

推荐阅读