zoukankan      html  css  js  c++  java
  • 初识Vue

    初学Vue所遇

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="utf-8" />
     5         <title></title>
     6         <script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
     7     <script>
     8         //let定义变量,,const定义常量
     9         let app= new vue({
    10             el:'#app',//用于挂载要管理的元素
    11             data:{
    12                 message:'Hello Vue'
    13             }
    14         })
    15     </script>
    16     </head>
    17     <body>
    18         <div id="app">{{message}}</div>
    19         
    20     </body>
    21     
    22 </html>

    未能显示相应数据,打开开发者模式时发现vue没有引用成功,再次修改代码

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="utf-8" />
     5         <title></title>
     6         <script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
     7     
     8     </head>
     9     <body>
    10         <div id="app">{{message}}</div>
    11         
    12     </body>
    13     <script>
    14         //let定义变量,,const定义常量
    15         let app= new Vue({
    16             el:'#app',//用于挂载要管理的元素
    17             data:{
    18                 message:'Hello Vue'
    19             }
    20         })
    21     </script>
    22 </html>

    修改后,成功显示数据,需要注意的地方是Vue的定义要在Body下面,并且Vue需要首字母大写。

  • 相关阅读:
    java集合Collection常用方法详解
    JavaWeb_cookie和session
    JavaWeb_Cookie
    Java中双向链表
    Java链表基础
    select函数详解及实例分析
    socket select函数的详细讲解
    记录远程用户登录日志
    MSSQL grant
    dll 中使用ADO
  • 原文地址:https://www.cnblogs.com/MOMOCJN/p/12603193.html
Copyright © 2011-2022 走看看