今天开始接触Vue，并且随手敲代码查看效果
刚兴致勃勃的上手，就碰见了个很纠结的问题，Vue貌似并没有加载成功
下面是代码
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <title>Insert title here</title>
6 </head>
7 <script src="https://cdn.jsdelivr.net/npm/vue"></script>
8 <body>
9 <div id="app">
10 {{ message }}
11 </div>
12 <script>
13 var app = new Vue({
14 el: ‘#app‘,
15 data: {
16 message: ‘Hello Vue!‘
17 }
18 })
19 </script>
20 </body>
21 </html>
首先自己XJB调，更换代码块顺序，如下
1 <script src="https://cdn.jsdelivr.net/npm/vue"></script>
2 <script>
3 var app = new Vue({
4 el: ‘#app‘,
5 data: {
6 message: ‘Hello Vue!‘
7 }
8 })
9 </script>
10 <div id="app">
11 {{ message }}
12 </div>
当然还是不可以正常显示，百度到一条是Vue不兼容IE，而之前浏览器查看时这样显示
于是发现当前是在猎豹浏览器的IE兼容模式下，于是切换到极速模式
但发现还是不行，检查代码，发现之前XJB改，将js代码放在了元素前面，执行js时无法获取元素，修改代码
1 <script src="https://cdn.jsdelivr.net/npm/vue"></script>
2 <div id="app">
3 {{ message }}
4 </div>
5 <script>
6 var app = new Vue({
7 el: ‘#app‘,
8 data: {
9 message: ‘Hello Vue!‘
10 }
11 })
12 </script>
好了，Vue正常运行
原文地址：https://www.cnblogs.com/shixoamo/p/10480184.html
时间： 2024-08-30 01:24:57