Vue官方网站：Vue.js - 渐进式 JavaScript 框架 | Vue.js (vuejs.org)
基础知识
对于我们初次学习，我们使用自行下载js的方式。
本次文章使用的是vue2.7.js版本，版本过低有些操作可能无法实现。
了解Vue编写方式
- 一个vue实例只能接管一个容器
- 插值语法：{{}} 可以读取到在data的所有属性
创建hello word页面
html代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>vue2</title> </head> <body> <div id="app"> {{message}} </div> </body> </html>
js代码
el：用于指定当前vue实例为哪个容器使用，值为css选择器字符串
data：用于储存数据，数据供el指定的容器使用
<script src="./js/vue2.js"></script> <script> var app = new Vue({ el: '#app', data: { message: 'Hello world!', }, }); </script>
结果
通过控制台修改数据
