微信小程序> 微信小程序实现多行文字滚动

微信小程序实现多行文字滚动

浏览量:1174 时间: 来源:Archer_yy

小程序
wxml

view class="full" style="height:100%;overflow:hidden"      swiper autoplay="true" interval="3000" duration="500" circular="true" vertical="true" style="height:100%"        swiper-item wx:for="{{topnewslist}}" wx:key="{{index}}" catchtouchmove='catchTouchMove'          van-notice-bar scrollable="{{false}}" bindtap="tonewsdetail" wx:for="{{item}}" wx:for-item="it" wx:key="{{index}}" data-newsid="{{it.new_id}}" style="width:100%" text="{{it.new_topic}}" /        /swiper-item      /swiper    /view

wxss

swiper-item {  height: 100%;}

js

//index.js//获取应用实例import api from "../../utils/api.js"var token = ''const app = getApp()Page({  data: {    topnewslist:[]  },  onLoad: function () {  },  tonewsdetail(e){    var newsid=e.currentTarget.dataset.newsid;    wx.navigateTo({      url: '/pages/newsdetail/newsdetail?newsid='+newsid,    })  },  loadscrollnews(){    api.get("mpapi/mpmnews.ashx", { action:'toplist',token:token}).then((res)={      if(res.code==1){      //res.list=[{"new_id":1,"new_topic":"111"},{"new_id":2,"new_topic":"222"},{"new_id":3,"new_topic":"333"},{"new_id":4,"new_topic":"444"}]        this.setData({          topnewslist: this.splitArr(res.list, 2)  //调用          //调用之后[[{"new_id":1,"new_topic":"111"},{"new_id":2,"new_topic":"222"}],[{"new_id":3,"new_topic":"333"},{"new_id":4,"new_topic":"444"}]]        })      }    })  },  /**   * 分割数组创建二维数组封装   * @param data 数组   * @param senArrLen 需要分割成子数组的长度   */  splitArr(data, senArrLen){    //处理成len个一组的数据    let data_len = data.length;    let arrOuter_len = data_len % senArrLen === 0 ? data_len / senArrLen : parseInt((data_len / senArrLen) + '') + 1;    let arrSec_len = data_len  senArrLen ? senArrLen : data_len;//内层数组的长度    let arrOuter = new Array(arrOuter_len);//最外层数组    let arrOuter_index = 0;//外层数组的子元素下标    // console.log(data_len % len);    for (let i = 0; i  data_len; i++) {      if (i % senArrLen === 0) {        arrOuter_index++;        let len = arrSec_len * arrOuter_index;        //将内层数组的长度最小取决于数据长度对len取余,平时最内层由下面赋值决定        arrOuter[arrOuter_index - 1] = new Array(data_len % senArrLen);        if (arrOuter_index === arrOuter_len)//最后一组          data_len % senArrLen === 0 ?            len = data_len % senArrLen + senArrLen * arrOuter_index :            len = data_len % senArrLen + senArrLen * (arrOuter_index - 1);        let arrSec_index = 0;//第二层数组的索引        for (let k = i; k  len; k++) {//第一层数组的开始取决于第二层数组长度*当前第一层的索引          arrOuter[arrOuter_index - 1][arrSec_index] = data[k];          arrSec_index++;        }      }    }    return arrOuter  },  // 截获竖向滑动  catchTouchMove: function (res) {    return false  },})

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎