分类 技术文章 下的文章

对于新技术的使用,我总是比别人慢好几拍。记得10年jQuery正渐渐流行起来,我当时不屑一顾,没想到后来转行成前端,一用就是很多年。

Flex布局早就听说过,但是一直没有实际用过。主要原因就是当年浏览器的兼容性不太好,而工作要兼顾较低版本的浏览器。

实际上,在移动端,Flex布局的兼容性已经很好了,完全可以在实际开发中放心的使用。我在最近的工作中,全盘使用了Flex布局。每当回想起以前汗流浃背地解决各种居中,为了实现要求的布局使用大量的多余的元素、css……时,再对比使用flex布局后的气定神闲,我就会感到使用flex布局是那么的幸福。

- 阅读剩余部分 -

微信小程序中,隐藏滚动条的方法,其实就是通用的css:

::-webkit-scrollbar {
  width: 0;
  height: 0;
  color: transparent;
}

但是在小程序中,它只能隐藏scroll-view组件的滚动条,page中的滚动条还是依然存在。

如果想让页面没有滚动条,可以用一个scrll-view来当做页面的容器,但是这时候可能就没法用page提供的方法了,比如enablePullDownRefresh。如何取舍就要根据实际需要决定了。

微信小程序的input有默认的最小高度

input.png

所以想要重置它们的高度,仅仅设置height是不够的,还要一起设置min-height:

input {
  height: 40rpx;
  min-height: 40rpx;
  /* 或者 */
  min-height: 0;
}

另外,从图中可以看出input已经是block类型的元素了。

一、基本使用

Swiper是一个非常好用的滑动插件,可以用来实现轮播图、代替浏览器默认的滚动条。中文主页:

https://www.swiper.com.cn/

在Vue中,Swiper对应的是Vue-Awesome-Swiper,NPM的地址:

https://www.npmjs.com/package/vue-awesome-swiper

基本的使用比较简单,首先安装Vue-Awesome-Swiper

npm install vue-awesome-swiper --save

- 阅读剩余部分 -