destoryed与beforeDestory
项目：《钱隆归来》
时间：2017年11月24日
问题：在destoryed中清掉计时器不起作用
描述：destoryed函数在实例销毁之前调用，在这一步，实例完全可用。
在beforeDestory在实例销毁之后调用，在这一步，实例就不可用了。
filters中this的指向
项目：《招生宝》
时间：2017年11月29日
问题2：在filters中使用data中定义的属性报错undefined
描述：filters中this为undefined,使用
解决办法：可在filters中定义变量再使用
关键代码：
filters: {
filterBtnTitle(item,args) {
let btnTitle
console.log(args)
if (item.teacherConfirmStatus) {
if (item.paused === 1) {
// 1是暂停，代表学生发起了撤消请求
btnTitle = '同意撤消'
}
btnTitle = '已确认'
} else {
btnTitle = '确认为我的学生'
}
return btnTitle
}
},
filters传多个参数
项目：《招生宝》
时间：2017年11月29日
问题：使用filters传多个参数，位置互换返回结果错误
描述：使用(item.orderNo, item.paused) | filterBtnTitle方式来传参数错误，filters管道符前边的参数为第一个参数，第二个，第三个参数应该依次在filters方法后边。
<div>{{(item) | filterBtnTitle(item.paused)}}</div>
过比较两个对象中的key来判断是否相等
项目：《招生宝》
时间：2017年12月4日
问题：使用===判断两个对象是否相等，返回false
描述：因为一个是写进数组的对象，一个是在页面中点击产生的对象，对象是引用地址方式，两个不同引用地址比较结果肯定是false
解决办法：通过比较两个对象中的key来判断是否相等。
错误代码：：
// 判断指定元素是否在数组中,因为两个数组并不相等，所以一直返回false，但此处复选框没必要去判断元素是否已在数组中，因为点一下添加进数组中，再点一下就删除了
isInArray(arr, value){
for(var i = 0; i < arr.length; i++){
// if(value.orderNo === arr[i].orderNo){
// console.log(11111111);
// return true;
// }
}
return false;
},
对象的赋值操作为引用地址方式
项目：《招生宝》
时间：2017年12月4日
问题：先定义一个对象为它赋值，再定义第二个对象等于第一个对象，再为第二个对象赋值，此时打印第一个对象和第二个对象的值是相等的，因为此时两个对象引用同一地址
let obj1=new Object()
obj1.name='Frank'
let obj2=obj1
obj2.name='Muse'
console.log(obj1.name);
为数组对象增加删除指定元素的方法
项目：《招生宝》
时间：2017年12月4日
问题：
// 为数组对象增加删除指定元素的方法
removeByValue(arr, val) {
for(var i=0; i<arr.length; i++) {
if(arr[i] === val) {
arr.splice(i, 1);
break;
}
}
},
使用filters方法进行数组去重
项目：《招生宝》
时间：2017年12月4日
问题：先判断元素是否在数组中，如果在就删除，我用了上述isInArray，removeByValue两个方法先后来操作，但此处可巧妙运用数组的filters方法，直接返回数组中不等于当前选中元素的那一项，就实现了删除相等的那一项
关键代码：
let arr = arr.filters(item => {
return item.orderNo !== item.orderNo
})
switch return 和break不能一起用
项目：《招生宝》
时间： 2017年12月4日
问题：在switch分支处语法检查报错 Unreachable code no-unreachable
描述： switch return 和break不能一起用
解决办法：将switch返回结果赋值给一个变量，最后再返回这个变量
请求接口格式
项目：《招生宝》
时间： 2017年12月4日
问题：请求接口提交数据格式不正确，
描述: 在外边给json赋值后，用的时候又用了{}括起来了，提交数据格式为json时，可以直接用post({key:value}),也可以先赋值再使用
错误代码：
const params ={}
query.then({params}).then().catch()
正确代码：
1.queryOrderList({
uname: keywords
})
2.const params = {}
params.uname = keywords
queryOrderList(params).then().catch()
问题1：移动端字体小于12px时使用line-height字体整体靠上
项目：《招生宝》
时间：2017年12月4日
问题1：移动端字体小于12px时使用line-height字体整体靠上
解决办法： display:tabel默认是垂直居中，使用display: table来实现垂直居中效果并不是特别明显，所以再配合使用缩放来对元素进行缩放，给要垂直居中的元素外再套一层
关键代码：
.wrapper {
display: table,
font-size: 20px;
height: 28px;
line-height: 28px;
width: 72px;
transform: scale(0.5),
// transform-origin 设置旋转元素的基点位置，必须与transform一起使用
transform-origin: 100% 100%
span {
display: tabel-cell;
vertical-align: middle;
}
}
问题2：使用transform:scale可以实现缩放，但还占据着原来的空间，导致元素没有在原本应该的位置上显示
解决办法： 使用zoom: 0.5来进行缩放，还不占据空间，zoom: 设置或检索对象的缩放比例
只有dom方法才会真实接受$event对象
项目：《招生宝》
时间：2017年12月4日
问题：页面显示数据使用{{btnTitle(item.status, item.no, $event)}}方法来根据数据显示按钮样式，本想用$event来获得当前对象来改变其背景图，但$event为undefined
描述：此处用来过滤功能的btnTitle方法并不是一个dom方法，所以并不会真实接受$evnet对象
解决办法：在此用一个flag来做标志，如果是特殊样式falg = true,如果不是flag = false，然后当flag= true时添加class名，获取元素方法使用获取元素方法使用refs,给按钮绑定refs
关键代码：
<a class="confirm-button tac c3e" ref="btns" @click="handleClick(item.teacherConfirmStatus, item.paused, item.orderNo)" :class="{'confirmed': isconfirm}" v-show="buttonShow === 'all'">{{filterBtnTitle(item.teacherConfirmStatus, item.paused, item.status,key)}}</a>
let flag = true
if (status = '同意撤消') {
flag = false
}
if (flag) {
this.nextTick(() => {
this.$refs.btns[index].className ='confirmed'
})
}
正则表达式格式
项目：《招生宝》
时间：2017年12月6日
问题：正则表达式不起作用
描述：格式错误
正则表达式 let newTime = /\d{4}-\d{1,2}-\d{1,2}/g.exec(time)写成了 let newTime = /\d(4)-\d(1,2)-\d(1,2)/g.exec(time)
newTime[0].replace(/-/g, '.')写成了newTime[0].replace(\-\g, '.')
接口返回状态码是数字
项目：《招生宝》
时间：2017年12月6日
问题：请求mock数据接口时接口状态一直返回失败，
描述：状态码2000000写成了“2000000”
错误代码： {
"path": "",
"delay": 500,
"name": "",
"description": "",
"isPaging": false,
"datasource": "success.data",
"responseName": "success",
"response": {
"success": {
"retcode": "5000000",
"message": "获取数据成功",
"data": {}
},
"failure": {
"code": "201",
"status": "FAILURE",
"message": "服务异常"
}
}
}
正确代码 ：
{
"path": "",
"delay": 500,
"name": "",
"description": "",
"isPaging": false,
"datasource": "success.data",
"responseName": "success",
"response": {
"success": {
"retcode": 5000000,
"message": "获取数据成功",
"data": {}
},
"failure": {
"code": 201,
"status": "FAILURE",
"message": "服务异常"
}
}
}
请求接口参数格式
项目：《招生宝》
时间：2017年12月6日
问题：向后台 传参数时需要的是数组，但得到的是json
描述：因为传参数时传的时候用的{}括起来了，而括号里是一个数组，所以是json格式，并不是数组都是这样默认显示的（数组名，数组值），这明显是json格式。
错误代码： confirmBatch(
{batchArr}
).then((res) => {
this.$dialog.alert(res.message)
// window.location.reload()
}).catch((err) => {
this.$dialog.alert(err.message)
})
得到的错误结果：{"batchArr": [{"orderNo": "1323"}]}
项目：《招生宝》
时间：2017年12月6日
问题：做批量确认时，当所选学生订单数量为0时，disabled不可用
描述：一直以为是数据判断或者属性绑定方法有错误 ，但经过各种测试都没错，百度才发现disabled是input标签专属的属性！
以下摘自w3school：
input标签的disabled属性，规定应该禁用input元素！
根据个人信息在显示不同状态
项目：《招生宝》
时间：2017年12月7日
问题：批量确认时，弹出框要弹出老师选择了某某某等几个学生，所以我把学生名字放在了一个数组里，我做的操作是当选中时单击删除，未选中时单击添加，但出现一种情况是删除一个数组就清空了，长度也变为0
描述：从数组中删除元素时使用的方法是比较学生名字，忽略了学生同名的情况，当学生同名时，把名字数组里的相同元素都删除了，但其他未点击的元素样式没变，还是已选中状态，也有被这一状态迷惑的原因。后来尝试比较学生id，但同一个学生可能有两个订单，所以也可能删除两个订单，改为比较订单号
解决办法：
调用方法时将学生姓名与学生订单号一同传递给批量确认的方法，将两个属性作为组成一个对象，然后写进数组中，再进行显示
关键代码： <input type = "checkout" @click="handleSelected"></div>
handleSelected(orderNo, index, $event, uname) {
var orderNoObj = {}
orderNoObj.orderNo = orderNo
// 获取当前元素,即当前列表项
var $curr = $event.currentTarget
// 设置当前元素背景图为选中状态
if ($curr.className === 'unChecked') {
$curr.className = 'checked'
this.batchArr.push(orderNoObj)
var selectedObj = {}
selectedObj.uname = uname
selectedObj.orderNo = orderNo
this.batchNameArr.push(selectedObj)
} else {
// 设置当前元素背景图为未选中状态
$curr.className = 'unChecked'
// 使用filters删除指定元素
this.batchArr = this.batchArr.filter((item) => {
return item.orderNo !== orderNo
})
this.batchNameArr = this.batchNameArr.filter((item) => {
return item.orderNo !== orderNo
})
}
}
}
微信浏览器不能使用window.location.reload()成功刷新
项目：《招生宝》
时间：2017年12月7日
问题：移动端微信浏览器使用window.location.reload()刷新页面不管用
描述：location.reload()方法是重新加载当前文档，由于微信缓存问题,reload只是从缓存中装载文档，导致使用window.location.reload()不能成功刷新，所以使用href属性来使浏览器读取并显示新的url内容
解决办法： 使用window.location.href = window.location.href + 时间戳来更新当前url内容
关键代码：
window.location.href = this.updateUrl(window.location.href)
// 解决微信浏览器使用window.location.reload()刷新页面无效问题
updateUrl(url, key) {
key = (key || 't') + '=' // 默认是"t"
var reg = new RegExp(key + '\\d+') // 正则：t=1472286066028
var timestamp = +new Date()
if (url.indexOf(key) > -1) { // 有时间戳，直接更新
return url.replace(reg, key + timestamp)
} else { // 没有时间戳，加上时间戳
if (url.indexOf('?') > -1) {
var urlArr = url.split('?')
if (urlArr[1]) {
return urlArr[0] + '?' + key + timestamp + '&' + urlArr[1]
} else {
return urlArr[0] + '?' + key + timestamp
}
} else {
if (url.indexOf('#') > -1) {
return url.split('#')[0] + '?' + key + timestamp + location.hash
} else {
return url + '?' + key + timestamp
}
}
}
}
},
vue中执行对dom进行操作的js代码应该放在Vue.nextTick()中
项目：《招生宝》
时间：2017年12月7日
问题1：搜索学生后搜索页和再返回列表页后每个第一个“确认为我的学生”按钮处样式都有问题
描述1：因为当订单处于“同意撤消”和“确认学生”时都是有边框的样式，而"已确认"时状态样式不一样，此处用了一标志flag判断，flag为true时就加class名"confirmed"，正常列表中第一个为“已确认”,已经给元素加了class名，当搜索时虽然flag为false，没有走赋class名的条件语句 ，但也没有去掉class名的分支条件.
解决办法1：加上如果flag为flase时去掉class名的分支语句
问题2：用this.refs.btns[index].className报错
描述2：在vue中执行对dom进行操作的js代码应该放在Vue.nextTick()中，
Vue.nextTick()是在下次DOM更新循环结束之后执行回调。在修改数据后立即使用这个方法，这样回调函数在dom更新完之后就会被调用.
即需要使用随数据改变而改变的dom结构的操作都应该放在Vue.nextTick()中,
正确代码：
if (flag) {
this.nextTick(() => {
this.refs.btns[index].className
})
}
vue dom更新updated
项目：《趣学君》
时间：2017年12月22日
问题：dom更新时未执行里边的方法
描述：dom更新时的方法应该是updated,而不是update，实例创建完成后（挂载阶段还没开始）事件是created,不是create