浅谈mint-ui loadmore组件注意的问题

如下所示：

loadTop(){
  this.$store.dispatch('getNewsList',{channelId:this.id,page:0,size:this.size});
  this.$refs.loadmore.onTopLoaded();
},

比如在做下拉刷新的时候，切记在下拉刷新的函数中要加

this.$refs.loadmore.onTopLoaded();

这行代码，否则下拉加载之后一直显示加载中，而不会加载完成。

以上这篇浅谈mint-ui loadmore组件注意的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 详解vue mint-ui源码解析之loadmore组件

    本文介绍了vue mint-ui源码解析之loadmore组件,分享给大家,具体如下: 接入 官方接入文档mint-ui loadmore文档 接入使用Example html <div id="app"> <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" :bottom-all-loaded="allLoaded" :max-dis

  • Vue.js 的移动端组件库mint-ui实现无限滚动加载更多的方法

    通过多次爬坑,发现了这些监听滚动来加载更多的组件的共同点, 因为这些加载更多的方法是绑定在需要加载更多的内容的元素上的, 所以是进入页面则直接触发一次,当监听到滚动事件之后,继续加载更多, 所以对于无限滚动加载不需要写首次载入列表的函数, 代码如下: html: //父组件 <div v-infinite-scroll="loadMore" infinite-scroll-disabled="loading" infinite-scroll-distance=

  • mint-ui的search组件在键盘显示搜索按钮的实现方法

    代码如下所示: <form action="" target="frameFile"> <mt-search v-model="value" placeholder="请输入关键字" @keyup.native.enter="search(value)"> <div v-infinite-scroll="loadMore()" infinite-scroll

  • Mint-UI时间组件起始时间问题及时间插件使用

    在使用Mint-UI的时候,官方的demo是这样的 <template> <mt-datetime-picker ref="picker" type="time" v-model="pickerValue"> </mt-datetime-picker> </template> <script> export default { methods: { openPicker() { this

  • 浅谈Vue-cli单文件组件引入less,sass,css样式的不同方法

    vue-cli中已经内置配置好了sass 以及lass的配置.如果需要的话直接下载两个模块就可以了,webpack它会根据 lang 属性自动用适当的加载器去处理. 如果需要使用sass,则安装: npm install node-sass --save-dev npm install sass-loader --save-dev 如果需要使用less,则安装: npm install less --save-dev npm install less-loader --save-dev sass

  • 浅谈vue-router路由切换 组件重用挖下的坑

    问题描述:vue-router导航切换 时,如果两个路由都渲染同个组件,组件会重(chong)用,组件的生命周期钩子不会再被调用,使得组件的一些数据无法根据 path的改变得到更新 翻车现场再现: 这是我的/router/index.js 的内容节选 export default new Router({ routes: [ { path: '/main', component: Main }, { path: '/get', component: Main } ] }) 这是我的 Main.v

  • 浅谈React Native 中组件的生命周期

    浅谈React Native 中组件的生命周期

    概述 就像 Android 开发中的 View 一样,React Native(RN) 中的组件也有生命周期(Lifecycle).所谓生命周期,就是一个对象从开始生成到最后消亡所经历的状态,理解生命周期,是合理开发的关键.RN 组件的生命周期整理如下图: 如图,可以把组件生命周期大致分为三个阶段: 第一阶段:是组件第一次绘制阶段,如图中的上面虚线框内,在这里完成了组件的加载和初始化: 第二阶段:是组件在运行和交互阶段,如图中左下角虚线框,这个阶段组件可以处理用户交互,或者接收事件更新界面: 第

  • 浅谈Vue2.0父子组件间事件派发机制

    从vue1.x过来的都知道,在vue2.0中,父子组件间事件通信的$dispatch和$broadcase被移除了.官方考虑是基于组件树结构的事件流方式实在是让人难以理解,并且在组件结构扩展的过程中会变得越来越脆落.特别是在组件层级比较深的情况下.通过广播和事件分发的机制,就显得比较混乱了. 官方在废除的同时,也为我们提供了替换方案,包括实例化一个空的vue实例,使用$emit反应子组件上的状态变化 1.使用$emit触发事件 helloWorld.vue作为父组件,dialogConfigVi

  • 浅谈React高阶组件

    浅谈React高阶组件

    前段时间在工作中写Hybrid页面时遇到了这样的一个场景,公司需要一系列的活动组件,在每个组件注册的时候都需要调用App端提供的一个接口.一开始也考虑了几种方式,包括mixin.组件继承以及react高阶组件.但经过了种种衡量,最后选择使用了高阶组件的做法. 那什么是高级组件?首先你得先了解请求ES6中的class只是语法糖,本质还是原型继承.能够更好的进行说明,我们将不会修改组件的代码.而是通过提供一些能够包裹组件的组件, 并通过一些额外的功能来增强组件.这样的组件我们称之为高阶组件(High

  • 浅谈vue自定义全局组件并通过全局方法 Vue.use() 使用该组件

    简介 Vue.use( plugin ):安装 Vue.js 插件.如果插件是一个对象,必须提供 install 方法.如果插件是一个函数,它会被作为 install 方法.install 方法将被作为 Vue 的参数调用. 当 install 方法被同一个插件多次调用,插件将只会被安装一次. Vue.js 的插件应当有一个公开方法 install .这个方法的第一个参数是 Vue 构造器,第二个参数是一个可选的选项对象: MyPlugin.install = function (Vue, op

  • 浅谈VUE uni-app 自定义组件

    1.父组件向子组件传递数据可以通过 props 2.子组件向父组件传递数据可以通过自定义事件,父组件自定义事件,子组件触发父组件的事件,并传传递数据 3.子组件可以定义插槽slot,让父组件自定义要显示的内容 4.使用easycom规范,可以真接使用组件 page/news/news.vue <template> <view> <veiw>自定义组件使用规范</veiw> <card color="red" @fclick=&quo

  • 浅谈VUE uni-app 基础组件

    1 .scroll-view 使用竖向滚动时,需要给 一个固定高度,通过 css 设置 height:使用横向滚动时,需要给添加white-space: nowrap;样式. scroll-y:允许纵向滚动,scroll-x:允许横向滚动 @scroll: 滚动时触发,event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} 数据双向绑定 <template> <view> &

  • 浅谈mint-ui loadmore组件注意的问题

    如下所示: loadTop(){ this.$store.dispatch('getNewsList',{channelId:this.id,page:0,size:this.size}); this.$refs.loadmore.onTopLoaded(); }, 比如在做下拉刷新的时候,切记在下拉刷新的函数中要加 this.$refs.loadmore.onTopLoaded(); 这行代码,否则下拉加载之后一直显示加载中,而不会加载完成. 以上这篇浅谈mint-ui loadmore组件注

  • 浅谈react受控组件与非受控组件(小结)

    我们都知道,有许多的web组件可以被用户的交互发生改变,比如:<input>,<select>,或者是我现在正在使用的富文本编辑器.这些组件在日常的开发中很不显眼,我们可以很轻易的通过输入一些内容或者设置元素的value属性来改变组件的值.但是,因为React是单向数据流绑定的,这些组件可能会变得失控: 1.一个维护它自己state里的value值的<Input>组件无法从外部被修改: 2.一个通过props来设置value值的<Input>组件只能通过外部

随机推荐