VUE静态页面helloworld

我怕爱的太早我们不能终老 提交于 2020-02-11 05:39:45

独立版本CDN

BootCDN : https://cdn.bootcss.com/vue/2.2.2/vue.min.js //国内

unpkg: https://unpkg.com/vue/dist/vue.js  //最新发布

cdnjs : https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js

vuejs : https://vuejs.org/js/vue.min.js

https://unpkg.com/vue  //未压缩版本

入门实例

<!DOCTYPE html>

<html style="height: 100%;">

     <head>

         <meta charset="UTF-8">

         <script type="text/javascript" src="../lib/vue.min.v2.5.11.js" ></script>

         <title>HelloDemo</title>

     </head>

     <body style="height: 100%;">

         <style>

             

         </style>

         <div id="appVue">

              <div>

                   {{message}}

              </div>

         </div>

         <script>

              new Vue({

                   el:"#appVue",

                   data:{

                       message:"Hello vue.js!"

                   }

              })

         </script>

     </body>

</html>

页面显示结果:Hello vue.js!

VUE把数据和 DOM建立起了关联,所有东西都是响应式的,Vue 在背后做了大量工作。

 

REF:

    https://cn.vuejs.org/v2/guide/

    http://www.runoob.com/vue2/vue-tutorial.html

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!