Vue.js初探

一、简介

　　1、定义：

Vue.js是当下很火的一个JavaScript MVVM库，它是以数据驱动和组件化的思想构建的。相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用Vue.js。

　　2：MVVM（Model-View-ViewModel）,在常用的MVC（Model-View-Controller）模式的基础上，增加了一层ViewModel，核心，它能够实现数据驱动，也是常说的双向绑定的前提：不仅View的更改可以反映到Model，Model的更改也可以反映到View，二者实现的前提也就是ViewModel把二者联系起来了。

二、使用Vue.js

　　一个简单的hello world的示例，让你看清双向绑定使用Vue.js的好处，直接上代码：

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>vuejs</title>
</head>

<body>
    <!--这是view-->
    <div id="app">
        {{message}}
    </div>
    <script src="js/vue.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        // 这是model
        var model={
            message:"hello vue.js"
        };
        // 这是ViewModel，vue实例
        // 连接view和model
        new Vue({
            el: '#app',//Vue实例挂载到id为app标签上
            data: model//数据来源于model对象
        });
    </script>
</body>

</html>