I have a complex application where I previously utilized jQuery to dynamically change views:
$(function(){
$(".changeview").bind("click",function(){
$.post(linkAction,phpData,function(data){
$('#loaded').append(data);
},"json");
});
});
Recently, I came across VueJs and started exploring the possibility of loading fully independent Vue components. In my data response, I include a Vue Component (in JSON) like so:
<div id="app">
<ul>
<li v-for="p in persons">
{{p.nom}}, {{p.prenom}}, {{p.age}}
</li>
</ul>
</div>
<script>
new Vue({
el: '#app',
data: {
persons:[{
"prenom": "Emalee",
"nom": "Ridges",
"age": 55
},{
"prenom": "Lil",
"nom": "Tuvey",
"age": 38
}]
},
})
</script>
However, instead of displaying the Vue component, it is being shown as text.
Uncaught ReferenceError: Vue is not defined
Any thoughts on what might be causing this issue?