一、什么是Vue.js

Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动

——引用于Vue.js官网

Vue.js介绍以及起步教程:

网址

二、起步练习

通过引入CDN的方式使用vue.js
创建一个.html文件，然后引入下图script代码，即可将vue.js引入项目并使用了

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

文本插值
通过以下代码即创建好了第一个vue应用

<html>
    <head>
        <meta charset="utf-8">
        <!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
        <title></title>
    </head>
    <body>
        <div id="app">{{message}}</div>
        <script type="text/text/javascript">
            var app=new Vue({
                el:'#app',
                data:{
                    message:'Jay'
                }
            })
        </script>
    </body>
</html>

效果如下:

部分语法解释:

el:全名element，指需要获取的元素，一定是html中的根容器元素。
data:用于数据的存储，可以设置对应的数据，data的值也是一个对象，类型可以是字符串、number、对象、数组。
花括号{}：这里是模板语法。如果data类型是字符串，花括号可以直接获取到相关数据的值，而且这个花括号是不会写入DOM结构的。因为Vue是将拥有的内容放在虚拟DOM中，通过DOM操作再把需要的值插入到真实DOM中。