美文网首页
8-3城市选择页布局 、better-scoll插件的使用

8-3城市选择页布局 、better-scoll插件的使用

作者: 废柴阿W | 来源:发表于2018-10-21 20:38 被阅读0次

布局
BFC的使用


image.png

伪类元素的使用(stylus语法
&符号表示和当前class同级的元素,否则指下级元素)


image.png

Better-scoll 的使用

  1. 安装 npm i better-scroll --save
  2. 组件中引入 import bscroll from 'better-scroll'
  3. 使用 const wrapper = document.querySelector('.wrapper')
    const scroll = new BScroll(wrapper)


    image.png
    image.png

注意DOM的结构要符合插件所提供的结构
基本语法:var myscroll = new BScroll('.wrapper');
这里的 '.wrapper'是容器的class
基本结构是 <div class='wrapper'><ul class='content'><li></li></ul></div>
BScroll的挂载点 必须在父元素 且父元素的高度要低于子元素高度

ref属性的使用

image.png image.png

相关文章

网友评论

      本文标题:8-3城市选择页布局 、better-scoll插件的使用

      本文链接:https://www.haomeiwen.com/subject/etkizftx.html