21-vue项目的技巧经验和所学

组件连接的自我认知
  子组件被 import 到父组件时，就已经产生了组件之间的连接。
 
运行项目出现问题时
  如果数据不显示，一看console 二看vue devtools 三看数据代码是不是写的有问题
 
遇到input的潜意识反应
  input标签->加上v-model->立即在data区域双向绑定的数据
 
props
  都是子组件接受父组件数据，并使用props
 
methods
  methods 里面：定义方法时，应该要考虑 是否要定义形参(根据有无需要改变的变量，若有，则应该定义形参) -->进一步考虑，不需要参数，能否实现方法的功能 --> 需传参时，要明白参数的数量、名称、作用。
 

**{ {xxx}} **
  { {xxx}}，xxx可以是函数、变量。若是函数，则为计算属性computed(回调函数)， 例如“反选框(读取每个数据项的状态，监听自己是否被勾选)”。 另外，v-model=“xxx”，xxx有两种情况：变量 和 计算属性computed
 
最近用到的数组方法
  ①filter() 返回新数组
  ② unshift() 将元素插在数组首位 且 不返回新数组
  ③splice(index,deleteCount,newItem1，newItem2…)可以增删替换且不返回新数组
  ④foreach(item)遍历方法
  ⑤reduce() 例如：
    reduce((preTotalCount,todo) => preTotalCount + (todo.complete?1:0),0)

 
  ⑥sort() 排序方法 例如：

fPersons.sort(function(p1,p2){
    
         //返回负数p1在   前，返回正数p2在前
	if(orderType===1){
    
    
		return p1.age-p2.age; //升序 (返回值为负)
	}else{
    
    
		return p2.age-p1.age; //降序
		}
}

 
  ⑦indexof() 获取数组中某元素的下标
 
其他
  可以先确定props中需要哪些属性和函数 --> 有函数的话先声明定义函数 --> 最后悬挂在需要的标签上