-
【v-if和v-show】：均用来控制dom显示/隐藏，当值为true则显示，为false则隐藏。
if 和 show的一大区别：
在于if是通过销毁dom的方式实现隐藏，而show是通过隐藏dom的方式实现的，具体需要灵活使用。 若只需不频繁切换隐藏显示时用v-if可以，其会使元素从dom中清除，每次切换都得重新渲染，加载。 若需频繁切换时用v-show，它会自动加上display：none，并没有从dom中清除，这样就不用重新渲染，性能好。
【v-for属性】：主要用于遍历数组数据，并自动生成dom列表。
其循环显示，最好加上：key = inde，,如果不需要排序可以使用index，如果需要排序或者做其他操作，不用index，存在问题。
如： v-for="(item, index) of list" :key='index'，
（其中:key必须是唯一的，item是遍历出的子项；-->item:数据，index:下标）
list是数组的话使用 of ，前面的参数为（value,index）；
list是对象的话使用 in ，前面的参数为（value,key,index）;
<div v-for="(value, key, index) in object">
{{ index }}. {{ key }}: {{ value }}
</div>
这里官网上已经变成in了，感觉使用新写法比较好，第三个值才是索引查看全部 -
【Vue的官方网站】：http://cn.vuejs.org
一、【步骤】：
进入之后点击 -->学习 -->教程 -->点击左侧安装选项 -->使用开发版本（直接使用<script>标签引入） -->点击进入复制源代码 -->在编辑器新建vue.js文件，把代码粘贴进来保存 -->新建一个index.html文件 -->把vue.js导入，在head里用<script src="vue.js"></script>导入
二、【实例】：
1、如果用script引入js，最好放在head里面，用于防止页面抖屏
2、vue编写着重于数据
3、语法：
<html>
<head>
<meta charset="utf-8">
<title>Vue入门</title>
<script src="vue.js"></script>
</head>
<body>
<div id="root">//挂载点
{{msg}} //挂载点里的内容都叫做模板内容，也可直接将模板内容放到实例的template里面去
</div>
<script>
new Vue({ //vue实例
el: "#root",
//template : '<h1>{{msg}} world</h1>' ,
data:{
msg:"hello wold"
}
})
</script>
</body>
</html>
查看全部 -
computed:计算属性
watch: 侦听器
查看全部 -
属性绑定: v-bind: 可简写为 :
双向绑定：v-model
查看全部 -
v-if和v-show：这两个属性用来控制dom显示/隐藏，当值为true则显示，为false则隐藏。if和show的一大区别在于if是通过销毁dom的方式实现隐藏，而show是通过隐藏dom的方式实现的，具体需要灵活使用；
v-for属性：主要用于遍历数组数据，并自动生成dom列表。如v-for='(item, index) of list' :key='index'，其中:key必须是唯一的，item是遍历出的子项；-->item:数据，index:下标
查看全部 -
scoped：定义了作用域，只对当前局部组件有效
查看全部 -
引入的局部组件，需要在components中注册
查看全部 -
子组件向父组件通信：子组件中用$emit订阅发布，向外推出方法，父组件监听对应的方法
查看全部 -
scoped局部样式，子组件颜色不会影响父组件颜色
查看全部 -
template模板里面只能有一个包裹元素，最外部用一个<div>包裹
data以前是个数据 ，现在是个函数
父组件通过属性的形式给子组件传值
子组件在props里面接收，声明对content（父组件所传递值）的使用
查看全部 -
vue入口文件main.j
页面显示内容为App组件的内容
查看全部 -
父组件向子组件传值是通过属性的方式完成的查看全部
-
this.$emit查看全部
-
循环的时候，增加key，增加渲染效率
查看全部 -
监听器 watch，监听属性变更，进行相应操作
查看全部
举报