Question

我只是将vue.js与jquery一起使用。我的情况是，我试图用jquery注入sidebar html代码（里面有vue语法）到main.html。但是，在我将sidebar.html注入main.html后，vue.js无法编译注入的语法的vue语法。那么有人可以帮我解决这个问题吗？ vue的功能是角度scope.apply吗？

Answer 1

vue的功能是角度scope.apply吗？

正如here所述，Vue异步执行DOM更新。每当观察到数据更改时，它将打开一个队列并缓冲在同一事件循环中发生的所有数据更改。在下一个事件循环“tick”中，Vue刷新队列并执行实际工作。

为了等到Vue.js在数据更改后更新完DOM，您可以在数据更改后立即使用Vue.nextTick（回调）。在更新DOM之后将调用回调，这类似于AngularJS，您将代码包装在$ apply（）中并启动$ digest循环。

代码示例：

<强> HTML

<div id="example">{{ message }}</div>

<强> JS

var vm = new Vue({
  el: '#example',
  data: {
    message: '123'
  }
})
vm.message = 'new message' // change data
vm.$el.textContent === 'new message' // false
Vue.nextTick(function () {
  vm.$el.textContent === 'new message' // true
})

为什么你的代码不起作用只能在查看代码后才能诊断出来。

Answer 2

解决问题的最简单方法是在jquery注入后将vue实例挂载到元素中。这是通过在vue构造函数中使用el选项指定它来完成的。或者使用$mount

很难让jquery（它的html部分）用vue.js顺畅运行，我建议一直使用vue。一种简单的方法是一次加载所有vue模板，然后只更改数据。

Vue范围新鲜

2 个答案: