Zusammenfassung der Probleme, die bei der Entwicklung von WeChat-Miniprogrammen aufgetreten sind-Mini-Programmentwicklung-php.cn

Zusammenfassung der Probleme, die bei der Entwicklung von WeChat-Miniprogrammen aufgetreten sind

高洛峰

Freigeben： 2017-02-18 11:55:13

Original

1810 Leute haben es durchsucht

Zusammenfassung der bei der Entwicklung von WeChat-Miniprogrammen aufgetretenen Probleme

1. Da die wx.request()-Methode des Miniprogramms asynchron ist, nachdem app.js Ajax ausgeführt hat, Jede Seite wird geladen. Die globalen Daten von app.js können nicht der Reihe nach geladen werden. Beispiel:

//app.js
App({
  ajax:function(){
    let that = this;
    wx.request({
      url: &#39;https://a.com/url.php&#39;,
      method: &#39;GET&#39;,
      success: function(e){
        that.data = 123;
      }
    })
  };
})
//content.js
let app = getApp()
Page({
  getData: function(){;
    app.ajax();
    console.log(app.data); //undefined
  }
})

Nach dem Login kopieren

Lösung: Verwenden Sie die asynchrone Promise-Funktion:

//app.js
App({
  ajax:function(){
    let that = this;
    let promise = new Promise(function(resolve, reject){
      wx.request({
        url: &#39;https://a.com/url.php&#39;,
        method: &#39;GET&#39;,
        success: function(e){
          that.data = 123;
          resolve();
        }
      })
    });
  };
})
//content.js
let app = getApp()
Page({
  getData: function(){;
    app.ajax().then(()=>{
      console.log(app.data); //123
    });
  }
})

Nach dem Login kopieren

2. Das Bild kann nur die ursprüngliche Breite und Höhe erhalten, nicht jedoch die vorhandene Breite und Höhe. Das Bild-Tag kapselt jedoch das Modusattribut, das je nach Bedarf festgelegt werden kann.

3. Am unteren Rand jedes Bild-Tags befindet sich ein transparenter Raum, kein Abstand, kein Rand. Beim Erstellen einer Maskenebene vor dem Bild kann es zu Problemen kommen.

4. Netzwerkanforderungen müssen https bereitstellen

5. Bei der Konfiguration von tabBar muss der pagePath-Parameter im Listenparameter mindestens den ersten Pfad im Seitenarray in app.json enthalten Dies führt dazu, dass tabBar nicht angezeigt wird.

6. TabBar kann beim Springen keine Parameter annehmen:

//search.js
var app = getApp();
Page({
  confirm: function(e){
    //获取数据，添加到全局
    let val = e.detail.value;
    app.searchWord = val;
    this.jump();
  },
  jump: function(){
    //跳转tabBar
    wx.switchTab({
      url: &#39;../index/index&#39;,
    });
  },
});
 
//index.js
var app = getApp();
Page({
  onShow: function(e){
    //获取全局数据
    let val = app.searchWord;
  }
});
//需要传递参数的页面在跳转前将数据添加到app.js里。需要接受参数的页面在onShow方法接受之前添加到app.js的数据。

Nach dem Login kopieren

7. Miniprogramm wx.request() Methode Die angeforderte Die URL muss mit https beginnen

8.wx.request() Wenn Sie die Post-Methode zum Anfordern verwenden, müssen Sie auch einen Header hinzufügen, und der Header[Inhaltstyp]-Wert ist application/x-www- formular-urlencodiert. Beispiel:

wx.request({
  url: &#39;https://a.com/url.php&#39;,
  data: {message: 123},
  method: &#39;POST&#39;,
  header: {
    &#39;content-type&#39;: &#39;application/x-www-form-urlencoded&#39;
  },
  success: function(e){
    console.log(e)
  }
});

Nach dem Login kopieren

9. Das Applet kann keine HTML-Tags laden und die Datenwiedergabe kann keine WXML-Tags rendern ( usw.). .) können Sie wxParse.js verwenden, um zugehörige Daten zu verarbeiten.

10. Android kann die von wx.request() angeforderten Daten nicht rendern.

Überprüfen Sie, ob die zurückgegebenen Daten einen Stücklistenkopf (3 Leerzeichen) haben. Bei der wx.request-Analyse von Android wird der BOM-Header nicht übersprungen, sodass die Daten als Zeichenfolge und nicht als Objekt oder Array zurückgegeben werden.

Beispiel:

Die zurückgegebenen Daten sind: (3 Leerzeichen){a:1, b:2}

Die analysierten Daten sind: '{a: 1 , b:2}' (Zeichenfolge), nicht {a:1, b:2} (Objekt)

Da es sich nicht um ein Objekt handelt, funktionieren Vorlagenrendering und dergleichen nicht ordnungsgemäß. Die Lösung besteht darin, den Stücklistenkopf zu entfernen, bevor Daten im Hintergrund zurückgegeben werden. Wenn der BOM-Header nicht im Hintergrund entfernt wird, kann er am Frontend entfernt werden. Wenn der Datentyp von wx.request jedoch auf „Standard“ gesetzt ist, wird er standardmäßig auf „json“ gesetzt und automatisch analysiert, sodass der BOM-Header nicht entfernt werden kann .

Lösung:

wx.request({
  url: url,
  method: &#39;GET&#39;,
  dataType: &#39;txt&#39;,
  success: function(e){
    let json = e.data.trim();
    let arr = JSON.parse(json);
  }
});

Nach dem Login kopieren

Ändern Sie den Datentyp in ein anderes Format als JSON, um zu verhindern, dass das Applet automatisch analysiert JSON-String, verwenden Sie dann die Methode trim() für die zurückgegebenen Daten, um Leerzeichen zu entfernen, und analysieren Sie schließlich den JSON-String.

11. Das Auslassen mehrerer Zeilen (-webkit-line-clamp) ist beim Debuggen normal, beim Veröffentlichen jedoch ungültig.

Lösung: Wenn Sie nicht noch einmal überprüfen möchten, lassen Sie einfach den Hintergrund abschneiden

Vielen Dank fürs Lesen, ich hoffe, es kann allen helfen, vielen Dank für Ihre Unterstützung dieser Website !

Weitere verwandte Artikel zur Zusammenfassung der Probleme bei der Entwicklung von WeChat-Miniprogrammen finden Sie auf der chinesischen PHP-Website!