子组件无法监听点击
需要 @click.native="xxxx"
### 频繁刷新
- 防抖(debounce)
debounce(func,delay){let timer = nullreturn function(...args)={if(timer){clearTimeout(timer)}setTimout(()=>{func.apply(this,args)},delay)}}const refresh = debounce(this.$refs.scroll.refresh)this.$bus.$on("itemImgLoad", () => {refresh()
避免超过两层{{xx.xxx.xxxx}}
如要使用,
,就可以解决报错
无数据则不渲染dom
<div v-if="Object.keys(<对象>.length !==0)">//<对象>长度不为零时,渲染该元素及其子元素
### 获取$refs.xxx组件的元素
this.$refs.xxx.$el.offsetTop//获取xxx元素的顶部位置
```
better-scroll滚动问题
scrollTo移动到指定位置
scrollTo(x,y)
获取滚动位置问题
封装probeType默认值为0,原生也为0,不进行监听。
需要从组件传入:probe-type="3"
for in
```
for(i in xxx){
log.i//'i'是字符串
}
```
### 使用(中央事件总线)$bus或vuex的选择
```
如果两个组件都确定已加载,则都可以使用
如果期中一组件可能没有加载,不能发送总线事件,则不可使用$bus
```
### $bus的使用
```
Event.$emit('msg',this.msg); 发送数据,第一个参数是发送数据的名称,接收时还用这个名字接收,第二个参数是这个数据现在的位置;
Event.$on('msg',function(msg){ 接收数据,第一个参数是数据的名字,与发送时的名字对应,第二个参数是一个方法,要对数据的操作
/这里是对数据的操作
})
```
### 使用VUEX缓存数据出现无法更新视图
```
data(){
return {
// url:this.$store.state.detail.playUrl, //如果这样写的话会更新不了
a:'1', //这个在本组件里面的数据就可以更新 这个a 在created生命周期后三秒改变值就可以更新视图
}
},
computed:{
//这里需要把store 动态的数据放到computed里面才会同步更新 视图
getPlayUrl(){
return this.$store.state.detail.playUrl
}
},
```
### Vuex getters映射到组件中
```
import {mapGetters} from 'vuex'
computd:{
...mapGetters(['getters中需要使用的方法']),
}
computd:{
...mapGetters({
别名 : 'getters中需要使用的方法名'
},),
}
```
### Vuex actions映射到组件中
```
import {mapActions} from 'vuex'
methods:{
...mapActions(['函数名']),
}
```
## 适配
### 静态引入
require('assets/icon/home.svg')