In diesem Artikelbeispiel wird der spezifische Code für das WeChat-Applet zur Implementierung des Scrollens von mehrzeiligem Text zu Ihrer Information geteilt. Der spezifische Inhalt ist wie folgt wxml <Ansichtsklasse="vollständig" Stil="Höhe:100%;Überlauf:versteckt"> <swiper autoplay="true" Intervall="3000" Dauer="500" kreisförmig="true" vertikal="true" Stil="Höhe: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> </Ansicht> wxss Swiper-Element { Höhe: 100%; } js //index.js //Holen Sie sich die Anwendungsinstanz-Import-API aus "../../utils/api.js" var token = '' const app = getApp() Seite({ Daten: { Topnewsliste:[] }, beim Laden: Funktion () { }, tonewsdetail(e){ var newsid=e.currentTarget.dataset.newsid; wx.navigateTo({ URL: '/Seiten/Newsdetail/Newsdetail?newsid='+Newsid, }) }, lädtscrollnews(){ api.get("mpapi/mpmnews.ashx", { Aktion:'Topliste', Token: Token}).then((res)=>{ wenn(res.code==1){ //res.list=[{"neue_id":1,"neues_Thema":"111"},{"neue_id":2,"neues_Thema":"222"},{"neue_id":3,"neues_Thema":"333"},{"neue_id":4,"neues_Thema":"444"}] dies.setData({ topnewslist: this.splitArr(res.list, 2) //Aufruf//Nach dem Aufruf von [[{"new_id":1,"new_topic":"111"},{"new_id":2,"new_topic":"222"}],[{"new_id":3,"new_topic":"333"},{"new_id":4,"new_topic":"444"}]] }) } }) }, /** * Array aufteilen, um ein zweidimensionales Array-Paket zu erstellen * @param Datenarray * @param senArrLen Länge des aufzuteilenden Subarrays */ splitArr(Daten, senArrLen){ //Verarbeite die Daten in Längengruppen let data_len = data.length; lass arrOuter_len = data_len % senArrLen === 0 ? data_len / senArrLen : parseInt((data_len / senArrLen) + '') + 1; let arrSec_len = data_len > senArrLen ? senArrLen : data_len; //Die Länge des inneren Arrays let arrOuter = new Array(arrOuter_len); //Das äußerste Array let arrOuter_index = 0; //Unterelementindex des äußeren Arrays // console.log(data_len % len); für (lass i = 0; i < Datenlänge; i++) { wenn (i % senArrLen === 0) { arrOuter_index++; lass len = arrSec_len * arrOuter_index; //Die Mindestlänge des inneren Arrays hängt vom Modulo der Datenlänge und -länge ab. Normalerweise wird die innerste Ebene durch die folgende Zuweisung bestimmt: arrOuter[arrOuter_index - 1] = new Array(data_len % senArrLen); if (arrOuter_index === arrOuter_len) //Die letzte Gruppe von data_len % senArrLen === 0 ? Länge = Datenlänge % senArrLen + senArrLen * arrOuter_index : Länge = Datenlänge % senArrLen + senArrLen * (arrOuter_index - 1); let arrSec_index = 0; //Der Index des Arrays der zweiten Ebene for (let k = i; k < len; k++) { //Der Anfang des Arrays der ersten Ebene hängt von der Länge des Arrays der zweiten Ebene * dem aktuellen Index der ersten Ebene ab arrOuter[arrOuter_index - 1][arrSec_index] = data[k]; arrSec_index++; } } } Rückgabewert arrOuter }, //Vertikales Gleiten abfangen catchTouchMove: function (res) { return false }, }) Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
<<: Beispiel für die Installation von nginx in einem angegebenen Verzeichnis
>>: MySQL verwendet UNIQUE, um das Einfügen nicht doppelter Daten zu implementieren
Nehmen Sie nun an, dass Sie dem Formular ein Elem...
Inhaltsverzeichnis 1. Übersicht 1.1 Erstellen ein...
In diesem Tutorial wird erklärt, wie Sie die IP-A...
Laden Sie das Image herunter (optionaler Schritt,...
In diesem Artikel werden hauptsächlich die Konfig...
Originalartikel: Ultimatives IE6-Cheatsheet: So b...
In CSS-Dateien sehen wir oft, dass einige Schrift...
Verwenden Sie Javascript, um ein Dropdown-Menü zu...
Guter HTML-Code ist die Grundlage einer schönen W...
Was ist ein Index? Ein Index ist eine Datenstrukt...
Das Projekt wurde vor Kurzem ausgesetzt und die U...
Inhaltsverzeichnis Tutorial-Reihe 1. Einführung i...
Docker-Nutzung von Gitlab Gitlab Docker Startbefe...
Wenn die Rahmenlänge früher kleiner als der Conta...
Plugin zum Umschreiben von Abfragen Ab MySQL 5.7....