1). 什么: 用来实现页面滑动相关效果的js库
2). 原理: 当内容的高度超过了容器的高度(固定)时, 才会形成滚动
3). 基本编码:
scroll = new BScroll(selector, {})
scroll.on(eventName, cb)
scroll.scrollTo()
scroll.refresh()
4). 注意:
创建BScroll对象的时机
创建BScroll对象的个数
BScroll禁用的原生dom事件, 自动定义事件分发
如果对大家有帮助,可以参考
1). 创建Swiper/BScroll对象后, 轮播/滑动没有效果?
原因: 创建对象太早, 得在数据显示后创建
解决: watch + $nextTick() 或 callback + $nextTick()
2). 初始显示异常
情况1: Cannot read property 'xxx' of undefined"
原因: 初始值是空对象, 内部没有数据, 而模块中直接显示3层表达式
解决: 使用v-if指令
情况2: Cannot read property 'avatar' of null"
原因: 初始值是null, 而模块中直接显示2层表达式
解决: 初始值为{}
3). 问题: 更新状态数据, 对应的界面不变化
原因: 一般方法给一个已有绑定的对象中添加一个新的属性, 这个属性没有数据绑定
解决:
Vue.set(obj, 'xxx', value)才有数据绑定
this.$set(obj, 'xxx', value)才有数据绑定
4). 问题: 点击添加购物项, 会1次添加多个
原因: 创建了多个BScroll对象来管理同一个DOM元素
解决: 只创建一个BScroll对象
扩展: 单例对象:
创建前, 先判断是否已经存在, 只有不存在才创建
创建后, 保存创建的对象
1). props
父子组件间通信的基本方式
属性值的2大类型:
一般: 父组件-->子组件
函数: 子组件-->父组件
隔层组件间传递: 必须逐层传递(麻烦)
兄弟组件间: 必须借助父组件(麻烦)
2). vue自定义事件
子组件与父组件的通信方式
用来取代function props
不适合隔层组件和兄弟组件间的通信
3). 消息订阅和发布
适合于任何关系的组件间通信
缺点: 管理不够集中
4). vuex
多组件共享状态(数据的管理)
组件间的关系也没有限制
功能比pubsub强大, 更适用于vue项目
5). slot
通信是带数据的标签
注意: 标签是在父组件中解析