vue2重点

1. v-for
   1.遍历字符串数组 一个数值不用括号()

<p v-for="(c,i) in city">----{{c}}----{{i}} </p>

	var vm=new Vue({
		el:"#mydata",
		data:{
			city:['北京','上海','广州']
		}


	});

2.遍历对象数组

  <p v-for="(c,i) in cityList">{{c.name}}</p>
          var vm=new Vue({
		el:"#mydata",
		data:{
			city:['北京','上海','广州'],
			cityList:[
				{name:"小明",age:'12'},
				{name:"小花",age:'12'},
				{name:"小刘",age:'12'},
			]
		}


	});

   3.遍历普通对象

<p v-for="(value,key,i) in city1">{{key}}-------{{value}}-----{{i}}</p>
        var vm=new Vue({
	el:"#mydata",
	data:{
		
		city1:{id:"1",name:"小明"}

	}


});

4.遍历 整数 <p v-for="count in 10">{{count}}</p>

2.key的使用 只是标识数据作用

<p v-for="(city,i) in cityList" :key="city.id">
			{{city.id}}----------{{city.name}}
</p>

3.v-if 和v-show
1.v-if只有true/false(必须是布尔值)/vue的变量 v-if=“true” 直接删除元素,一般情况使用

2.v-show display:none;元素,频繁切换显示使用
4.@click="del(s.id)" 向del方法传入模型的值是这样子的不是 del({{s.id}})
5.在vue中在函数定义变量与在data定义不可搞混乱
6.搞清楚 var定义的(直接使用) 和 在data定义的(用this.)
7.备份的数据写到data中
8.@keyup="search1"敲键盘后触发事件

9.过滤器 数据格式处理(小写转大写字母),时间格式转换
1.全局过滤器(要返回处理结果)整个页面都可以使用
1.使用方式:插值表达式,

  

    	<div id="app1">
		{{a|upcase}}
		</div>
      Vue.filter("upcase",function(value){
	value=value.toUpperCase();
	return value;

});

var vm=new Vue({


	el:"#app1",
	data:{
		a:"abcde"
	},
	methods:{

	}


	 });

      2.在混合v-for和其他指令中也可以使用
      3.使用多个过滤器

 <p>{{f.id}}---{{f.price | discountFilter | discountFilter1}}</p>

2.私有过滤器只可以在当前vue对象中使用(用的少)

 var vm=new Vue({
	el:"#app",
	data:{
		fruit:
		[
		   {id:"A001",name:"苹果",price:20},
		   {id:"A002",name:"香蕉",price:25},
		   {id:"A003",name:"雪梨",price:30},
		]

	},
	filters:{
		filter1(value){
			return value+"sss";
		}
	}


});

    3.全局过滤器和私有过滤器命名冲突先使用私有的(范围小的先)
    4.可以搭配使用