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
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,801评论 1 45
  • 定义 z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。 *注释 ...
    尾巴尾巴尾巴阅读 447评论 0 0
  • 读书分享人(文稿提供者)——陆彦 推荐语: 有没有觉得,孩子上小学后,自主意识突然变得超级强大?有...
    盛放读书阅读 928评论 1 2
  • 一个是在喧嚣里制造孤独,一个是在孤独里抚慰心灵。 推荐音乐:Yesterday--- Bob Dylan 今天终于...
    陆拾八阅读 2,197评论 5 3