# 发送验证码时按钮应为disabled

项目：《钱隆归来》
时间： 2017年11月
问题：短信发送验证码时应该不可用 应设disabled

# vue中父组件给子组件传变量要用v-bind绑定

项目：《钱隆归来》
时间： 2017年11月
问题： 父组件中给子组件加class名未生效
描述：父组件给子组件传变量要用v-bind 绑定

<q-button btnname="下一步" v-on:click="vilidate" v-bind:class="{ active: isActive,}"></q-button>
<q-button :btnname=btnname name="getViliCode" v-on:click="requestCode" v-bind:class="{ active: bgcWhite,}"></q-button>

# 封装的ajax-post方法没有接收参数

项目：《钱隆归来》
时间： 2017年11月
问题：请求用户信息时提示“用户信息获取类别格式错误”
描述：接口没有接收参数
// 提现到卡
export function rasiedCardInfo() {
  return http.post(apis.rasiedCardInfo, params)
}

应该改为：
// 提现到卡
export function rasiedCardInfo(params) {
  return http.post(apis.rasiedCardInfo, params)
}

# 请求接口时传递参数类型

项目：《钱隆归来》
时间： 2017年11月
问题： 投资类型错误
描述:  请求接口时传递参数错误

# 数字输入完毕自动补0

项目：《钱隆归来》
时间： 2017年11月
问题： input输入框如果输入了一位小数就返回小数位两个0，如果1个小数就返回小数位1个0，应该要写在mouseout或blur事件上，不能写在keyup事件中，因为你并不知道用户还输不输入
解决办法：
personalRate.mouseout(function() {
  this.value = toDecimal2(this.value)
  })

# 根据输入规则给数字补0

项目：《钱隆归来》
时间： 2017年11月
问题： 当用户输入条件不符合规则时失去焦点也返回两位小数
描述： 应该要做判断，当用户输入符合规则时再调用返回两位小数的函数
解决办法：
personalRate.mouseout(function() {
    if (this.value > 0 && this.value < 99) {
      this.value = toDecimal2(this.value)
    }
  })

# input限制用户输入的体验

项目：《钱隆归来》官网
时间： 2017年11月
问题： input输入框只能输入0-99之间的数，并且只能有两位小数，使用正则表达式限制用户输入，输入后就清空，体验不好
描述： 此处不应限制用户输入，应该是用户输入不符合规则时提示错误，并且按钮不变色不可用
if (this.value < 0 || this.value > 99999999) {
      $('#perFormatFalse').css({ 'display': 'block' })
      $('.perMoneyWrapper').css({ 'border': '1px solid #ff6867' })
    } else {
      let value1 = this.value.toString()
      if (value1.indexOf('.') > 0) {
        let arr = value1.split('.')
        value1 = arr[0] + '.' + arr[1].substring(0, 2)
        this.value = value1
      }

# input组判断是否达到条件

项目：《钱隆归来》官网
时间： 2017年11月
问题： 在每个计算模块中，当其中一个输入框满足输入条件时，都要判断其他三个是否满足条件，此处不应该只用是否有输入值"!value"来判断，应该也要判断输入值是否符合输入条件
描述：
    if (personalMoney.val() && personalMoney.val() > 0 && personalMoney.val() < 99999999 && personalDate.val() && personalRate.val() && personalDate2.val()) {
      personBtn.css({ 'background': '#ff6867' })
    } else {
      personBtn.css({ 'background': '#ccc' })
    }

# 使用函数定义公共样式

项目：《钱隆归来》官网
时间： 2017年11月
问题： 8个输入框在未输入状态、输入时状态和已输入状态的样式都一样，所以不应该在每个输入框的事件中去控制自己的样式
描述： 应该使用函数来定义公共样式，再将要改变状态样式的元素作为参数传给它，实现样式改变

# 小图标切出来有白边问题

项目：《趣学君官网》
时间： 2017年11月10日
问题： 小图标切出来有白边问题
解决：在图标外边套一层,比如加个span，给span加跟图标一样的背景色，再加border-radius等属性，
  <span class="tip-icon"><img src="images/st-tip_03.png"></span>
.tip-icon {
    position: relative;
    display: inline-block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    overflow: hidden;
    font-size: 0;
    background: #3e81f1;
    > img {
      position: absolute;
      top: -1px;
      left: -1px;
      width: 26px;
      height: 26px;
    }
  }

# 使用定位与transform解决垂直居中

项目：《趣学君官网》
时间： 2017年11月10日
问题：在ie9、10下都不支持display:flex属性，所以也不能使用align-itmes来垂直居中，所以如果要兼容浏览器，尽量不要使用flex属性
解决方法：使用定位来解决垂直居中的问题
.parent{
  position: relative;
}
.child {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

# 切图不仔细

项目：《趣学君官网》
时间： 2017年11月12日
问题：首页“合作伙伴”处图标都有两个边框
描述：原来的项目在图标外加了一个border，而这次是我直接切的带边框的图，没有仔细看清楚

# 判断ie版本号决定页面显示内容

项目：《趣学君官网》
时间： 2017年11月13日
问题：判断ie版本并显示，当ie版本号为8的时候不显示
描述：因为ie8的一些兼容问题导致程序报错，所以并不会执行上方所写的判断Ie版本的js语句
解决办法：使用条件注释在页面的html部分做判断

# window.onload()与document.wirte()实现浏览器版本过低给出提示

项目：《趣学君官网》
时间： 2017年11月13日
问题：当ie版本过低时使用document.write()实现页面重写，但只有使用window.onload在页面加载完成后才生效，当在浏览器切换ie版本后，页面还一直显示重写的页面
描述：因为window.onload()是页面加载完成后的事件，切换浏览器版本相当于刷新页面，还是会触发此事件，所以问题并不出现这里，而是重写页面后是一个新的页面了，并不是之前的页面，而一直是重写后的页面，所以也不会执行浏览器版本判断的语句，更不会切换页面！
错误代码:
  window.onload = function() {
    document.write('<p>浏览器版本过低，请使用高版本浏览器或谷歌浏览器')
  }
解决办法：此处就不应该在window.onload()里做页面的改变，可改变方法为使用document.write()添加内容到当前页面中，当浏览器版本过低时给页面加一个遮罩层，宽高都为Html的宽高，就可以把原来要显示的（问题）内容覆盖
关键代码：
<!--[if lt IE 9]>
    <script type="text/javascript">
      document.write("<div style='position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 100; width: 100%; height: 100%; padding-top: 200px;  background-color: #fff'><P  style='font-size: 50px; text-align: center'>请使用高版本IE浏览器或者谷歌浏览器！<br><span style='font-size: 30px;'>ie浏览器推荐下载地址：<a style='color: #343434; text-decoration: underline' href='http://rj.baidu.com/soft/detail/14917.html?ald'>http://rj.baidu.com/soft/detail/14917.html?ald</ a></span><br><span style='font-size: 30px;'>谷歌浏览器推荐下载地址:<a  style='color: #343434; text-decoration: underline' href='http://rj.baidu.com/soft/detail/14744.html?ald'>http://rj.baidu.com/soft/detail/14744.html?ald</ a></span></P></div>")
    </script>
  <![endif]-->

# webpack入门问题

项目：webpack入门练习
时间： 2017年11月14日
问题1：使用npm install -g webpack 提示错误，应该使用yarn global add webpack来实现全局安装
问题2：使用yarn add --save-dev webpack 来安装到项目目录提示错误 ，应该把webpack放在前边，使用 yarn add webpack --save-dev
问题3：初步配置好入口文件后执行打包命令提示找不到'app/main.js'
描述3：路径写错了，应该是'/app/main.js'

# 如何更好的为页面中多个元素添加相同class名（某一状态下）

项目：《钱隆归来》
时间： 2017年11月15日
问题： 当页面中有多个相同样式（即相同class名）时，如何更好的为每个元素动态添加class名
描述： 一开始在mothos中判断按钮状态是否应该变化，但页面中几个按钮样式相同时，除非使用多个判断条件改变在data中定义的相对应的变量，否则会变成样式全部改变
优化建议：data中定义的初始值一般只放页面展示的数据或经计算的数据等用户关心的变量，而改变样式这些不为用户关心的一般使用其他方法，可在computed中为要添加相同样式的class名“active”使用计算属性，返回逻辑值，再判断是否添加 class名
关键代码：
<div :class="{active: submit}"></div>
computed: {
  submit() {
    return this.input.length > 5
  }
}

# 用户登录后使用window.location.reload刷新页面

项目：《钱隆归来》
时间： 2017年11月15日
问题：点击修改登录密码是空白页
描述：最先只使用向后台发送手机号和密码，当返回成功信息后使用this.$router.push()来进行跳转页面，虽然经过了后台的处理已经产生了userId，但这只是前端路由的跳转，所以当前窗口并不会获取到，index.hmtl中的window.USER_ID = '<?=$uid?>'也没有值，所以要跳转后要使用window.location.reload刷新页面，重新从服务器去上下载该文档，才会产生userId，在此页面跳转要使用this.$router.replace()替换当前文档，不会添加记录到history中，避免了使用前进后退按钮时一直重复登录操作。
关键代码：
loginInfo({
  userName: userName,
  password: password
  }).then((res) => {
    if(res.retcode = 2000000) {
      alert('登录成功')
      this.$router.replace('/')
      window.location.reload()
    }
    })

# vue中使用swiper

项目：vue中使用swiper
时间： 2017年11月15日
问题：引入swiper之后swiper-slide不是并排排列，而是全部竖排在第一页，但可以实现滑动，只不过后边都是空白页
描述：因为没有引入css文件，所以样式不起作用，在main.js(应用入口)中引入css就可以了
关键代码：
import 'swiper/dist/css/swiper.min.css'

# 单页面中加入微信h5页面

项目：《钱隆归来》
时间： 2017年11月17日
问题：钱隆微信app中加了h5页面的链接跳转后是空白页
描述：链接错误,链接中不应该有.html扩展名
错误代码：
<a href='/web/Credit/Debtsafe.html'>详情</a>

# json格式错误

项目：《钱隆归来》
时间： 2017年11月21日
问题：新增mock数据后提示找不到“api/finance/pay/pay”
描述：在返回成功数据后多加了一个大括号，导致json串解析不正确

# promise连续调用的then函数中必须有返回值

项目：自学异步编程
时间： 2017年11月22日
问题：promise的then函数调用，只有第一个有值，后边的全是undefined
描述：错误原因是then函数中没有返回值，因为promise的then方法会返回一个新的Promise变量，这个变量取决于onFulFilled回调的返回值，当链接调用的时候每一个onFulFilled的入参，都是上一个onFulFilled的返回值，如果不在then函数中写返回值，那么下一个onFulFilled的入参就是undefined
错误代码：
 mypromise.then(function(message) {
    console.log('yee'+message)
    return mypromise
}).then(function(message){
    var message1 = message+ '11'
    console.log(message1)
}).then(function(message) {
    console.log(message+ '2')
}).then(function(message) {
    console.log('haha' + message)
})
(结果：yee message
      undefined11
      message2
      hahaundefined)

解决办法: 在每一个then方法中添加返回值,两种方法返回值与结果并不一样，此处解决办法只是解决then链式调用的方法。
1.直接返回参数
let mypromise = new Promise(function(resolve,reject) {
    setTimeout(function() {
        resolve('成功')
    }, 250)
})

mypromise.then(function(message) {
	return 'yee'+message
}).then(function(message){
	return message+'world'
}).then(function(message) {
	return message + 'hello'
}).then(function(message) {
	return 'haha' + message
})
（结果：hahayeemessageworldhello)

2.返回上述定义的mypromise对象

mypromise.then(function(message) {
	console.log('yee'+message)
  return mypromise
}).then(function(message){
	console.log( message+'world')
  return mypromise
}).then(function(message) {
	console.log(message + 'hello')
  return mypromise
}).then(function(message) {
	console.log('haha' + message)
  return mypromise
})
（结果：yeemessage
       messageworld
       messagehello
       hahamessage)

# 在beforeDestory中停掉页面的计时器

项目：《钱隆归来》
时间：2017年11月24日
问题：当投资状态status=0时，投资详情页面返回投资列表页时，弹出框显示undefined
描述：投资时填入输入金额但未支付时，投资状态是充值，status=0，每三秒请求一次，因离开本页面时未清掉计时器，所以当返回投资列表页时还会继续执行请求事件，在请求事件中定义了请求参数为当前路由参数，所以离开详情页返回列表页时当前路由并没有所需要的参数，这时再继续请求接口会返回错误“投资类型错误”,而不是因为充值未付款返回这个错误，因为如果充值未付款的话状态就应该一直是0，每次返回数据都应该一样。
解决办法：在beforeDestory中，清掉计时器事件，当页面离开时停止计时与请求接口。

项目：《钱隆归来》
时间：2017年11月24日
问题：在destoryed中清掉计时器不起作用
描述：beforeDestory函数在实例销毁之前调用，在这一步，实例完全可用。
在destory在实例销毁之后调用，在这一步，实例就不可用了。

# 使用clearTimeout清除计时器

项目：《钱隆归来》
时间：2017年11月24日
问题：使用this.timer = null 销毁计时器不管用
描述：在data中定义了this.timer = null ，在使用时用this.tiemr = setTimeout(getStatus, 3000)开启计时器，应该使用clearTimeout 来清掉计时器
关键代码：window.clearTimeout(this.timer)

# created是正在渲染，mounted是渲染完成

项目：《招生宝》
时间：2017年11月30日
问题：created方法里让div高度等于屏幕高度,报错cannot read property 'sytle' of null
描述：空值的style证明没有获取到dom元素，写在created方法里，created生命周期是将编译好的html模板替换掉el属性，此步是去做渲染这件事，但还没有完成，而在mounted生命周期阶段渲染已经完成，可实时监控dom并更新它，所以获取dom应写在这一步
关键代码：
mounted() {
  this.$nextTick(() => {
    document.getElementById('noOrder').style.height = window.innerHeight + 'px'
  })
}