本博客主要用于记录开发的过程以及开发问题处理方式,不粘贴开发代码。问题的解决原理我会单独做文章。
失物平台(邑丢丢)的开发代码的码云地址是https://gitee.com/MyKyle/yidd
1.今日完成进度
1.完成对饭卡模块的丢失部分开发
2.构思了贵重物品模块的界面设计图
3.完成对贵重物品模块的开发
2.今日问题以及处理
2.1 created生命周期函数调用methods对象的方法获取请求数据
Vue生命周期中,一般用于做请求数据赋值的是在created以及mounted这两个生命周期。
这两个生命周期的主要区别在于created(vue实例创建完后被调用),mounted(实例已挂载到DOM上后调用)。所以一般把数据放在created,可以及早发请求获取数据,在页面挂载完之前请求完成的话就看到闪屏就少一些,但是如果有些数据需要以来DOM的话,比如按DOM排序之类的就放到mounted里面。
关于生命周期其它学习可以参考我的文章:思维导图学习Vue生命周期
created () {
this.pickList = this.getPickUpList()
}
methods: {
getPickUpList () {
const res = [['阿里巴巴', '奥力法狗'], ['哔哔叭叭'], [], ['Didi']]
return res
}
}
2.2 js中setTimeOut()的返回值
MDN官方说法:
返回值
返回值
timeoutID
是一个正整数,表示定时器的编号。这个值可以传递给clearTimeout()
来取消该定时器。需要注意的是
setTimeout()
和setInterval()
共用一个编号池,技术上,clearTimeout()
和clearInterval()
可以互换。但是,为了避免混淆,不要混用取消定时函数。在同一个对象上(一个window或者worker),
setTimeout()
或者setInterval()
在后续的调用不会重用同一个定时器编号。但是不同的对象使用独立的编号池。
简单明了:是个定时器编号,用来取消定时器的。
2.3 计算属性computed传参的用法
<van-index-anchor :index="pickUpClass(index)"/>
computed: {
// 利用闭包思想实现传参
pickUpClass () {
return function (value) {
return String.fromCharCode((value + 65)) // 实现的是一个0~25转A~Z的功能
}
}
}
2.4 ASCAll码转换
string.split('') 字符串转数组
Array.join('') 数组转字符串
字符(string)转Ascii码:用string.charCodeAt();
Ascii码(num)转字符:用String.fromCharCode(num);
大写转小写 .toLocaleLowerCase()
小写转大写 .toLocaleUpperCase()
需要利用JS实现的是一个 0~25对应转A~Z 的功能,看网上的网友们各种天花乱坠的。下面一句话的事。
String.fromCharCode((value + 65)) // 实现的是一个0~26转A~Z的功能
原理:
060
48
0x30
0
字符0
0101
65
0x41
A
大写字母A
0132
90
0x5A
Z
大写字母Z
如何将0-26数字转换为A-Z
0对应65
25对应90
就是数字+65即可推出字母
2.5 switc用法
switch(expression){
case value :
//语句
break; //可选
case value :
//语句
break; //可选
//你可以有任意数量的case语句
default : //可选
//语句
}
2.6 如何防止浏览器填充input
<input type="text" autocomplete="off">
2.7 拨打电话的代码
window.location.href = 'tel://' + date;