Vue.js初步学习：二

Vue.js初步学：二

Vue.js是一套构建用户界面的渐进式框架,Vue 的核心库只关注视图层.

第一步：
每个 Vue 应用都需要通过实例化 Vue 来实现。
语法格式如下：
var vm = new Vue({
el: ‘#test’,
})

可以看到在 Vue 构造器中有一个el 参数，它是 DOM 元素中的 id。在下面实例中 id 为 test，意味着我们接下来的改动全部在以上指定的 div 内，div 外部不受影响。

引入vue的js文件

<script type="text/javascript" src="https://cdn.bootcss.com/vue/2.4.0/vue.js"></script>

五：使用v-show控制元素显示：
v-show 的true和false控制此元素是否显示

这里的 ok 参数值和 JavaScript 中的判断一致，为 0、null、undefined、false 时为假，其他值为真。

六：用户输入的双向绑定 使用v-model：
使用两个输入框进行绑定，某一个值的改变将改变另外一个

七：绑定方法 使用v-on 例子检测点击事件 反转字符串的方法

点击按钮之后：

八：数据过滤器 对输入的字符串过滤将第一个字符转换为大写

此方法将本将本来的abcdefg 变为了首字母大写Abcdefg

九：v-for标签循环 获取sites元素单个名字为site使用

循环一个对象中的全部元素

获取循环元素的下标