Директивы Vue.js не работают в JSP

Question

Я хочу включить некоторые реактивные vueJS в свой JSP-файл. Однако директивы Vue не распознаются парсером JSP, и это вызывает ошибку: net :: ERR_INCOMPLETE_CHUNKED_ENCODING.

Примером является:

<tbody id="items-${job.id}" v-for="item in items"> <tr>Item id = {{item.id}}</tr> ....

Здесь v-за директивы, как представляется, проблема.

В любом случае вы можете предложить решить эту проблему? Я бы хотел использовать Vue в своем JSP.

Answer 1

Вышеприведенный код не работает, потому что я ссылался на свой vue 'el' на неправильный элемент.

Следующий фрагмент работает и показывает, что можно использовать Vue.js с JSP.

<div id="vue-test"> 
    <div v-for="item in items" :key="item.id">  
    <p>Item id={{item.id}}, jobItemStatus = {{item.jobItemStatus}}</p> 
    </div> 
</div> 
<script src="https://unpkg.com/vue/dist/vue.js"></script> 
<script>  
var vueItems = new Vue({ 
    el: '#vue-test', 
    data: { 
     items : [] 
    }, 
    mounted: function(){ 
     <c:forEach items="${job.jobItems}" var="item" varStatus="status"> 
      this.items = this.items.concat({ 
       id: ${item.id}, 
       receptionDate : "${item.receptionDate}", 
       deliveryDate : "${item.deliveryDate}", 
       jobItemStatus : "${item.jobItemStatus}" 
       });    
     </c:forEach> 
    } 
}); 
</script>