Vue工作总结(更新中)

• css module中多个class带判断

div(:class="[$style.content, [fixed == true ? $style.isFixed :'']]")

li(:class="[key == num ? $style.active : '']")

• v-model修饰符

v-model.trim 将用户输入的前后的空格去掉
表单中使用

input(placeholder="请输入手机号" type="tel" maxLength="11" v-model.trim="formItem.mobile")
input(placeholder="请输入验证码" type="tel" v-model.trim="formItem.captcha" maxLength="6")

• 倒计时

span {{time ? `${fullNumber(time)}s`: `${codeText}`}}
  data() {
        return {
            codeText: '获取验证码',
  },
  watch: {
        time() {
            if(this.time){
                setTimeout(() => this.time--, 1000)
            }else{
                //this.nc.reset();
            }
        }
    }

• data里本地图片路径

1.
let shareIcon = require('../assets/shareicon.jpg')
export default {
   data() {
       return {
           appShareOption: {
               imgUrl: `${location.origin}${shareIcon}`
           }
       }
   }
}

2.
methods: {
   weixin(signPackage) {
       var shareOptions = {
           imgUrl: `${location.origin}/amvvm/src/invest/imgs/shareicon.jpg`
       }
   }
}

• 跳转地址带参数写法

location.href=`/amvvm/invest/?unqid=${_this.unqid}&user_key=${_this.user_key}#/result`

• 时间戳转换

var date = new Date(timestamp * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000