1.1 Vue.js简介_Vue.js入门与商城开发实战-QQ阅读男生科幻网

上QQ阅读APP看书，第一时间看更新

1.1　Vue.js简介

Vue.js（读音/vju：/，类似于view）是一套构建用户界面的渐进式框架。

Vue只关注视图层，采用自底向上的增量式开发设计。

Vue的目标是，通过尽可能简单的API实现响应的数据绑定和组合的视图组件。

Vue学习起来非常简单，本书基于Vue 2.x版本。

阅读本书前，你需要了解如下知识：

·HTML

·CSS

·JavaScript

入门实例

这里首先展示一个入门实例的代码和效果图。然后在接下来的小节中引导大家一步一步建立这个页面。

实例效果如图1-1所示。

图1-1　入门实例

代码示例如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue入门第一个vue页面</title>
<!--引用互联网中vue.js的代码，后面会讲解如何引用本地vue.js的代码-->    
<script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>
<body>
    <!--显示代码-->
    <div id="app">
        <!--显示变量message的内容，也就是显示“Hello Vue.js!”-->    
        <p>{{ message }}</p>
    </div>
    <!--脚本代码-->
    <script>
        new Vue({
            el: '#app',
            data: {
                message: 'Hello Vue.js!'
            }
        })
    </script>
</body>
</html>