Javascript VueJS动态更新v-html内容

我试图用JS更新一个v-html绑定，但我似乎有点卡住了。 有人能帮忙吗

代码的思想是我在每页都有一个项目列表。我想创建一个分页。其中页码表示当前页面

问题是我正在尝试更新页码，但似乎无法使其正常工作

我在jsfilde中添加了这个

变量配置={ 可搜索字段：['title'，'tags'，'actors']， 分类：{ 姓名(asc):{ 字段：“名称”， 订单：“asc” } }, 聚合：{ 标签：{ 标题：“标签”， 尺码：10 }, 参与者：{ 标题:"演员",， 尺码：10 }, 类型：{ 标题：“流派”， 尺码：10 } } } //这些行来自外部资源 // https://github.com/itemsapi/itemsapi-example-data/blob/master/jsfiddle/imdb.js itemsjs=itemsjsrows，配置； 每页var=3； var当前页面=1； var vm=新的Vue{ el：‘el’， 数据：函数{ //让它更通用 变量过滤器={}； Object.KeyConfiguration.aggregations.mapfunctionv{ 过滤器[v]=[]； } 返回{ 查询：， //使用空数组初始化筛选器 过滤器：过滤器， } }, 方法：{ 重置：功能{ 变量过滤器={}； Object.KeyConfiguration.aggregations.mapfunctionv{ 过滤器[v]=[]； } this.filters=过滤器； this.query=； } }, 计算：{ 搜索结果：函数{ var result=itemsjs.search{ query:this.query， 过滤器：这个。过滤器， 每页：每页， 页面：当前页面 } 返回结果 } } }; var含量=； 活跃变量=； var total=document.getElementByIdpagination\uuu total.value； var num_pages=Math.ceiltotal/每页； console.lognum_页面； 对于var i=1；我{ 当前页面=ev.target.getAttributedata-page； console.log当前页面； vm.searchResult.page=当前页面； }; } 项目列表{{searchResult.pagination.total}

在{{searchResult.timings.Search}ms中执行搜索，在{searchResult.timings.facets}ms中执行facets

{{bucket.key}{{bucket.doc_count}} 项目列表{{searchResult.pagination.total}-> 只需将当前页面放入数据中即可

然后使用vm.current_页面而不是current_页面

及

---

不，您不应该像那样更新计算值。有什么替代方法可以这样做？请使用脚本执行顺序发布。@appleapple我已经更新了代码并添加了一个指向JSFIDLE的链接。请你再看一眼好吗？我已经发布了一个答案，但由于你的代码太长，我只是猜测一下，请试试。@Selyst没问题：

...
var vm = new Vue({
  data: function() {
    ...
    return {
      query: '',
      current_page,
      filters: filters
    }
  }
  ...
}

pagination[i].addEventListener("click", ev => {
  vm.current_page = ev.target.getAttribute("data-page");
  console.log(vm.current_page);
});

searchResult: function() {

  var result = itemsjs.search({
    query: this.query,
    filters: this.filters,
    per_page: per_page,
    page: this.current_page // <-----
  })
  return result
}