认识Vue

什么是Vue呢？

初识Vue：

        1.想让Vue工作，就必须创建一个Vue实例，而且要传入一个配置对象哦；

        2.root容器里的代码依然符合html规范，只不过混入了一些特殊的Vue语法；

        3.root容器里的代码被称为——Vue模板；

        4.Vue实例和容器是一一对应的哈；

        5.重点！！！真实开发中只有一个Vue实例，并且会配合着组件一起使用；

        6.{{xxx}}中的xxx要写js**表达式**，且xxx可以自动读取到data中的所有属性；

        7.一旦data中的数据发生改变，那么页面中用到该数据的地方也会自动更新；

        注意区分：js表达式 和 js代码(语句)

                1.表达式：一个表达式会产生一个值，可以放在任何一个需要值的地方：

                            (1). a

                            (2). a+b

                            (3). demo(1)

                            (4). x === y ? 'a' : 'b'

                2.js代码(语句)

                            (1). if(){}

                            (2). for(){}

使用vue，首先是要引入Vue.js的呢。

<!-- 引入vue -->

    <script type="text/javascript" src="XXXX"></script>

下载Vue.js

<!-- 准备好一个容器 -->

    <div id="root">

        <!-- <h1>你好啊，这是插值语法{{名称}}</h1> -->

        <h1>你好啊，{{name}} 你{{age}}岁了哦，{{Date()}}</h1>

    </div>

new Vue({
       el: '#root', //el 用于指定当前vue 实例为哪个容器服务，值通常为css选择器字符串
       data: {               
                name: '大黄', 
                 age: '23'
           } 
   }）

这就是一个简单完整的Vue了，如果对你有所帮助，欢迎点赞收藏哦，小姐姐带你玩转web