WeChat開発における一般的な問題のまとめ

この記事では、WeChat 開発の一般的な問題について説明します。WeChat 開発の一般的な問題について知らない場合、または WeChat 開発の一般的な問題に興味がある場合は、この記事を見てみましょう。

WeChat開発でよくある問題のまとめ

1. ミニプログラムのwx.request()メソッドは非同期であるため、app.jsがajaxを実行した後、各ページがアプリのグローバルデータをロードします。 .js を順番に読み込むことはできません。例:

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

解決策、Promise 非同期関数を使用します:

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

2. 画像は元の幅と高さのみを取得できますが、既存の幅と高さを取得することはできません。ただし、イメージ タグはモード属性をカプセル化しており、必要に応じて設定できます。

3. 各画像タグの下部には、パディングやマージンではなく、透明なスペースがあります。画像の前にマスクレイヤーを作成するときに行き詰まってしまうことがあります。

4. ネットワークリクエストはhttps

をデプロイする必要があります。tabBarを構成する場合、listパラメータのpagePathパラメータには少なくともapp.jsonのpages配列の最初のパスが含まれている必要があります。そうでない場合、tabBarは表示されません。

6. TabBar はジャンプ時にパラメータを受け取ることができません。解決策:

//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: '../index/index',
    });
  },
});
  
//index.js
var app = getApp();
Page({
  onShow: function(e){
    //获取全局数据
    let val = app.searchWord;
  }
});
//需要传递参数的页面在跳转前将数据添加到app.js里。需要接受参数的页面在onShow方法接受之前添加到app.js的数据。

7. wx.request() が post メソッドを使用する場合、URL は https で始まる必要があります。リクエストするには、ヘッダーも追加する必要があります。header[content-type] の値は application/x-www-form-urlencoded です。例:

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

9. アプレットは HTML タグをロードできず、データレンダリングでは wxml タグ (89c662c6f8b87e82add978948dc499d2de5f4c1163741e920c998275338d29b2 など) を処理できます。関連データ。

10. Android は、wx.request() によって要求されたデータをレンダリングできません。

返されたデータに BOM ヘッダー (3 文字の空白) があるかどうかを検出します。 Android の wx.request 解析では BOM ヘッダーがスキップされないため、データはオブジェクトまたは配列ではなく文字列として返されます。

例:

返されるデータは次のとおりです: (3 文字の空白){a:1, b:2}

解析されたデータは次のとおりです: '{a:1, b:2}' (文字列) {a:1, b:2} (オブジェクト)

オブジェクトではないため、テンプレートのレンダリングなどが正常に動作しません。解決策は、バックグラウンドでデータを返す前に BOM ヘッダーを削除することです。 BOM ヘッダーがバックグラウンドで削除されない場合は、フロントエンドで削除できますが、wx.request の dataType がデフォルトの場合、デフォルトで json になり、自動的に解析されるため、BOM ヘッダーを削除できません。 。

解決策:

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

dataType を json 以外の形式に変更して、アプレットが自動的に json 文字列を解析しないようにし、次に、trim() メソッドを使用して返されたデータから空白を削除し、最後にjson文字列。

11. 複数行の省略 (-webkit-line-clamp) はデバッグ中は正常ですが、公開時には無効です。

解決策: もう一度確認したくない場合は、バックグラウンドを切り詰めてください

12. 単一の setData の長さは制限されています: 1048576

appservice:16 invokeWebviewMethod データ送信の長さは 2432088 を超えています。最大長は1048576です

私はFuを使用しています。テキストを使用する場合、特に画像がbase64でピクセルが非常に大きい場合に起こりやすいです

上記がこの記事のすべての内容です。それについてよく知っていれば、両方の側面を自分で実装でき、習得するのは簡単です。

関連する推奨事項:
WeChat開発の解決策 トークン検証の失敗

JSAPI TICKETを取得するためのWeChat開発のインスタンス共有

以上がWeChat開発における一般的な問題のまとめの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。