反省是一面镜子,它能将我们的错误清清楚楚地照出来,使我们有改正的机会。——海涅
1、如何利用css隐藏滚动条
在文本内容处理中,涉及文本内容过多,需要将其隐藏起来。通常使用:overflow-y: scroll; overflow-x: hidden;
这两行代码来处理。但是这样处理不美观,会存在滚动条。如何利用css样式将其隐藏起来呢?
解决办法:
直接上代码:
.item-content {
width: 715px;
height: 970px;
margin-left: 15px;
overflow-y: scroll;
overflow-x: hidden;
/* IE滚动条隐藏 */
-ms-overflow-style: none;
/* 火狐滚动条隐藏 */
scrollbar-width: none;
/* 旧版火狐滚动条隐藏 */
overflow: -moz-scrollbars-none;
}
/* 谷歌滚动条隐藏 */
.item-content::-webkit-scrollbar {
display: none;
}
2、如何将vue项目图标改成自己想要样子
该开始接触vue时,搭建vue脚手架做项目时都会看到浏览器上面有一个绿色倒三角的图标,这个是默认的样式。小编今天才知道原来这个是可以换的。(此处留下了不学无数的眼泪~~)
修改办法:
找到public文件夹中的favicon.ico文件,将其删除然后换成自己想要的图片,再将图片命名为favicon.ico,然后在vue.config.js配置文件中添加如下代码:
pwa: {
iconPaths: {
favicon32: 'favicon.ico',
favicon16: 'favicon.ico',
appleTouchIcon: 'favicon.ico',
maskIcon: 'favicon.ico',
msTileImage: 'favicon.ico'
}
},
然后再重新启动项目即可!
3、巧用es6中的map函数取后端传的数据
不知道大家有没有碰到这种情况,后端传的数据不符合自己的要求。小编在刚开始接触前后数据交互时,就碰到这样的苦恼。发现es6中map函数能很好解决这个问题。