解决vue变量未渲染前代码显示问题
将v-cloak最好写在根标签上:
<div v-cloak>
{{demo}}
</div>
绑定动态的样式
:style="{'stroke-dasharray': item.img}"
注:属性为 stroke-dasharray使用单引号区分,不然会报错
v-for多层循环
<div v-for="(item,index) in items">
<div v-for="(lists,typesIndex) in item.types">
<div v-for="(list,key) in lists.sites"></div>
</div>
</div>
自定义滚动事件
在mian.js中注册
Vue.directive('scroll', {
inserted: function (el, binding) {
let f = function (evt) {
if (binding.value(evt, el)) {
window.removeEventListener('scroll', f)
}
}
window.addEventListener('scroll', f)
}
});
在具有的html
<div v-scroll="handleScroll"></div>
实现上拉刷新组件
通过npm引入
1. 安装better-scroll
npm install better-scroll
2. 页面中引入better-scroll
import BScroll from 'better-scroll'
3. 如果不支持import,可使用
var BScroll = require('better-scroll')
参考链接:https://blog.csdn.net/qq_22557797/article/details/78866328