提示
本文主要讲解 Vue 入门知识。@ermo
# Vue 入门
Vue 是一个基于 JavaScript 的前端框架。
学习 Vue 前必须要了解的知识有:HTML、CSS、JavaScript、AJAX。
只需3个步骤就可以使用 Vue。
创建一个简单的 html 网页,引入 Vue 包。
<!DOCTYPE html>
<html lang="en">
<body>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
</body>
</html>
添加一个 div 元素。
<!DOCTYPE html>
<html lang="en">
<body>
<div id="app">
{{ message }}
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
</body>
</html>
添加一个 Vue 对象,与上面 div 元素进行绑定。
<!DOCTYPE html>
<html lang="en">
<body>
<div id="app">
{{ message }}
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script>
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
});
</script>
</body>
</html>
在浏览器打开当前 html 网页,可以看到下面内容。
Hello Vue!