Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

无限加载组件,上拉或是下拉刷新 #13

Open
deligent-ant opened this issue Jun 22, 2018 · 0 comments
Open

无限加载组件,上拉或是下拉刷新 #13

deligent-ant opened this issue Jun 22, 2018 · 0 comments

Comments

@deligent-ant
Copy link
Contributor

##无限下拉或是上拉组件

依赖:

  • 依赖 underscore 来编译模版字符串
  • 用户使用插件前要在 html 中先进行引入:
<script src="http://www.bootcss.com/p/underscore/underscore-min.js"></script>
  • 在浏览器端使用
    ;(function() {
      infiniteLoad({
        scollDirection: 'up', //滚动方向,‘up’||‘down’
        domString: '', //页尾栏  选择器,可以省略
        fatherString: '.content', //父亲元素 选择器
        childString: 'li', //标签名字
        template: '<p><%= date %></p><p><%= desc %></p><img src=<%= pic %> >', //模版字符underscore写法
        cb: async function({ limit, offset }) {
          let res = await axios.get('/json', {
            params: { limit, offset }
          })
          let { code, data } = res.data
          if (parseInt(code, 10) !== 0) return
          let mockData = Array.apply(null, { length: 50 }).map((item, index) => {
            return data[index % 2]
          })
          return mockData
        }, //页尾部栏可见时候,远程加载数据的函数,返回一个promise 数据是对象数组[{}]
        options: {
          //一开始的limit和offset限制
          limit: 2,
          offset: 0
        }
      })
    })()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant