js阻止rails ujs的ajax:success回调

我在同一个页面上使用ujs和vue,发现存在冲突。当json仍然通过ajax加载时,vue接管rails ujs回调并阻止其触发。ujs非常适合动态链接到api。vue也有其明显的好处。

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ujs/1.2.2/rails.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>

<div id="main">

  <a class="load-ujs" href="https://jsonplaceholder.typicode.com/todos/1" data-remote="true" data-method="get" data-type="json">Load JSON via UJS link</a>

  <p class="result-ujs"></p>

</div>

$('.load-ujs').on("ajax:success", function(event, data, status, xhr) {
  $('.result-ujs').text(xhr.responseText);
});

// Uncomment the following block and click the link again to demonstrate
// how Vue, once instantiated, conflicts with UJS ajax:success callback

/*
var app = new Vue({
  el: '#main',
  data: {
    number: 1
  }
});
*/

CodePen: https://codepen.io/MSCAU/pen/vVjLjB

最好的办法是什么?

(如果我们能解决这个问题,下一个问题就是让UJ处理一个Href指令-ie.v-bind:Href=”' https://jsonplaceholder.typicode.com/todos/ “+数字”-我知道它不能。)