学習ウィジェットで出会った問題のまとめ
4903 ワード
学習ウィジェットで発生した問題
1.ウィジェットでは、公衆番号のQRコードを画像スキャンで認識することができず、持参apiのwxを通過することができる.previewImageは、画像をプレビューする操作を行い、ローカルに保存して操作できます.しかし、例外的に、ウィジェットコードを識別することができます.
2.WebSocketは、HTML 5が提供し始めた単一のTCP接続上でフルデュプレクス通信を行うプロトコルである.WebSocket APIでは、ブラウザとサーバが握手をするだけで、ブラウザとサーバの間に高速チャネルが形成されます.両者の間で直接データを互いに転送することができる.ブラウザはJavaScriptを介してWebSocket接続の確立をサーバに要求し,接続が確立されるとクライアント側とサーバ側はTCP接続により直接データを交換することができる.Web Socket接続を取得するとsend()メソッドでサーバにデータを送信し、onmessageイベントでサーバから返されたデータを受信できます.
3.background-imageはネットワークurlまたはbase 64しか使用できない.ローカル画像はimageラベルでなければなりません.
4.複数行と1行を縦方向に中央揃えにする書き方.コンテナをdisplay:tableに設定し、サブエレメント、すなわち垂直に中央に表示するエレメントをdisplay:table-cellに設定し、vertical-align:middleを加えて実現します.
5.PageでonShareAppMessage関数を定義し、ページの転送情報を設定します.このイベント処理関数が定義されている場合にのみ、右上隅のメニューに「転送」ボタンが表示されます.ユーザーが転送ボタンをクリックすると、このイベントを呼び出すには、転送内容をカスタマイズするためにreturn Objectが必要です.
6.ラベル・コンポーネントを使用して、スクロール領域のプロパティを設定できます.
7.let宣言の変数は、varと同様に宣言されたブロックまたはサブブロックでのみ使用できます.両者の間の最も主要な違いはvarが宣言した変数の役割ドメインが閉鎖関数全体であることにある.
8.Promise.resolve(value)メソッドは、所与の値で解析されたPromiseオブジェクトを返します.しかし、この値がthenable(すなわちthenメソッド付き)である場合、返されるpromiseはこのthenableのオブジェクトを「フォロー」し、その最終状態(resolved/rejected/pending/settledを指す)を採用する.そうでなければ、この値を成功状態としてpromiseオブジェクトを返します.
9.コンポーネントbuttonで枠線を削除し、背景とborderを削除した後、偽クラスに::after{border:none;}さらに処理してこそ、枠線のない効果を実現することができます.
10.userInfoReadyCallbackは、ネットワーク操作の遅延による関連データの取得および設定を防止するためにカスタマイズされたグローバル関数(公式demoでindexページライフサイクル関数onLoadで定義されている)です.これにより、requestが完了しsuccessメソッドが正常にコールバックされると、userInfoReadyCallbackでカスタマイズされたグローバル関数が実行されます.
11.配列遍歴の様々な方法、es 6とウィジェットバージョン、array.map(function(){})は、他の遍歴よりもfor in,for ofが便利で、キー、値を取ることができ、エラーを報告しにくい.定義:配列内の各要素を処理し、新しい配列を得る.特徴:元の配列を変更しない;const array = [1, 3, 6, 9]; const newArray = array.map(function (value) { return value + 1; }); console.log(newArray); console.log(array); 同様の方法:for in,for,foreach const newArray 2=[];for (var i in array) { newArray2.push(array[i] + 1); }
const newArray3 = []; for (var i = 0; i < array.length; i++) { newArray3.push(array[i] + 1); }
const newArray4 = []; array.forEach(function (key) { newArray4.push(key * key); }) Arrayは下付き文字を使用でき、MapとSetは下付き文字を使用できない.ES 6はiterableタイプを導入し、Array、Map、Setはiterableタイプに属し、for...ofループを使用して遍歴することができる.var a=[‘A’,‘B’,‘C’].var s = new Set([‘A’, ‘B’, ‘C’]); var m = new Map([[1, ‘x’], [2, ‘y’], [3, ‘z’]]); for(var x of a){//Array alert(x)}for(var x of s){//Set alert(x)}for(var x of m){//Mapalert(x[0]+'='+x[1]);
for...ofとfor...inの違い:for...inループは履歴に問題が残っているため、実際にはオブジェクトの属性名を遍歴しています.Array配列は、実際にはオブジェクトでもあり、各要素のインデックスは属性とみなされます.var a = [‘A’, ‘B’, ‘C’]; a.name = ‘Hello’; for(var x in a){alert(x);//‘0’,‘1’,‘2’,‘name’}より良い方法:iterable内蔵forEach方法:var a=[‘A’,‘B’,‘C’];a.forEach(function(element,index,array){//element:現在の要素の値//index:現在のインデックス//array:Arrayオブジェクト自体alert(element);//'A','B','C'});
12.遍歴配列と接合json配列では、多くの異なる方法が試みられている.
13.dataデータとラベルの3元表示を組み合わせて、要素の非表示表示表示表示とスタイルを制御し、切り替えと選択処理を行い、タイムリーなクリアが必要で、カバーを避け、データ層の操作に注目する.
14スクリプトエラーまたはPage()を正しく呼び出す解決策//ページ内の.jsファイルに追加
Page({
}) export default class pageIndex extends wepy.page {
}または
15.globalData={userInfo:null,token:-1}例は共通クラスの値をとる.root. r o o t . parent.globalData.token
16 wx.navigateToは、ページスタックサイズが5 wxになるまでページスタックサイズを増加する.redirectToはページスタックサイズwxを増加する.navigateBackでは、ページスタックのサイズが1になるまでページスタックのサイズを減らします.異なるページの機能に対して、リダイレクトまたは戻る操作が必要な場合は、適宜インタラクティブに使用します.//onePage.wpy onShow()/アドレス操作後if(this.isBack){this.initPageData(this.tokenId)}}wx.navigateTo({ url:
17.現在、データの単一双方向バインドが流行しており、ウィジェットは一方向データストリームを使用しており、従来のjQuery方式でデータとビューを操作すれば、開発効率が低く、開発者は購入しない.双方向データストリームを使用すると、プログラムの実行効率が低く、論理層オブジェクトの状態が制御できません.全体的に、ウィジェットデータビューは開発モードを一方向にバインドし、開発者にイベント処理に専念させ、オブジェクトの状態を変更し、ビューの更新を実現させる.
18.ウィジェットのオリジナルドロップダウンを禁止json構成の「enablePullDownRefresh」:false httpは他のウェブサイトの資源を要求し、オリジナルのjsで を実現する.
19.【ウィーチャットウィジェット】画像のロードは成功したが、コンソールはレンダーレイヤネットワーク層のエラーを報告する
Thu May 03 2018 21:14:20 GMT+0800(中国標準時間)レンダーレイヤネットワーク層エラーVM 27762:2 Failed to load local image resource/goods/.png the server responded with a status of 404(HTTP/1.1 404 Not Found)エラーの原因は、ページがロードされたばかりのとき、imageの値が空であるため、画像のロードに成功したのは、バックグラウンドの値がエラーを解決する方法を伝え、imageにデフォルト値を設定したり、wxを使用するためである.if条件レンダリングコンポーネントはloading操作によってロード要求時に現れる複数回のロードとジッタを回避することができ、拡張体験は一般的にappに置くことができる.wpy親レベル、またはhttp.jsが作成したリクエストインタフェースにwxを統一的に配置する.showLoading({title:‘ロード中’,}) setTimeout(function(){ wx.hideLoading() },2000)
1.ウィジェットでは、公衆番号のQRコードを画像スキャンで認識することができず、持参apiのwxを通過することができる.previewImageは、画像をプレビューする操作を行い、ローカルに保存して操作できます.しかし、例外的に、ウィジェットコードを識別することができます.
2.WebSocketは、HTML 5が提供し始めた単一のTCP接続上でフルデュプレクス通信を行うプロトコルである.WebSocket APIでは、ブラウザとサーバが握手をするだけで、ブラウザとサーバの間に高速チャネルが形成されます.両者の間で直接データを互いに転送することができる.ブラウザはJavaScriptを介してWebSocket接続の確立をサーバに要求し,接続が確立されるとクライアント側とサーバ側はTCP接続により直接データを交換することができる.Web Socket接続を取得するとsend()メソッドでサーバにデータを送信し、onmessageイベントでサーバから返されたデータを受信できます.
3.background-imageはネットワークurlまたはbase 64しか使用できない.ローカル画像はimageラベルでなければなりません.
4.複数行と1行を縦方向に中央揃えにする書き方.コンテナをdisplay:tableに設定し、サブエレメント、すなわち垂直に中央に表示するエレメントをdisplay:table-cellに設定し、vertical-align:middleを加えて実現します.
5.PageでonShareAppMessage関数を定義し、ページの転送情報を設定します.このイベント処理関数が定義されている場合にのみ、右上隅のメニューに「転送」ボタンが表示されます.ユーザーが転送ボタンをクリックすると、このイベントを呼び出すには、転送内容をカスタマイズするためにreturn Objectが必要です.
6.ラベル・コンポーネントを使用して、スクロール領域のプロパティを設定できます.
7.let宣言の変数は、varと同様に宣言されたブロックまたはサブブロックでのみ使用できます.両者の間の最も主要な違いはvarが宣言した変数の役割ドメインが閉鎖関数全体であることにある.
8.Promise.resolve(value)メソッドは、所与の値で解析されたPromiseオブジェクトを返します.しかし、この値がthenable(すなわちthenメソッド付き)である場合、返されるpromiseはこのthenableのオブジェクトを「フォロー」し、その最終状態(resolved/rejected/pending/settledを指す)を採用する.そうでなければ、この値を成功状態としてpromiseオブジェクトを返します.
9.コンポーネントbuttonで枠線を削除し、背景とborderを削除した後、偽クラスに::after{border:none;}さらに処理してこそ、枠線のない効果を実現することができます.
10.userInfoReadyCallbackは、ネットワーク操作の遅延による関連データの取得および設定を防止するためにカスタマイズされたグローバル関数(公式demoでindexページライフサイクル関数onLoadで定義されている)です.これにより、requestが完了しsuccessメソッドが正常にコールバックされると、userInfoReadyCallbackでカスタマイズされたグローバル関数が実行されます.
11.配列遍歴の様々な方法、es 6とウィジェットバージョン、array.map(function(){})は、他の遍歴よりもfor in,for ofが便利で、キー、値を取ることができ、エラーを報告しにくい.定義:配列内の各要素を処理し、新しい配列を得る.特徴:元の配列を変更しない;const array = [1, 3, 6, 9]; const newArray = array.map(function (value) { return value + 1; }); console.log(newArray); console.log(array); 同様の方法:for in,for,foreach const newArray 2=[];for (var i in array) { newArray2.push(array[i] + 1); }
const newArray3 = []; for (var i = 0; i < array.length; i++) { newArray3.push(array[i] + 1); }
const newArray4 = []; array.forEach(function (key) { newArray4.push(key * key); }) Arrayは下付き文字を使用でき、MapとSetは下付き文字を使用できない.ES 6はiterableタイプを導入し、Array、Map、Setはiterableタイプに属し、for...ofループを使用して遍歴することができる.var a=[‘A’,‘B’,‘C’].var s = new Set([‘A’, ‘B’, ‘C’]); var m = new Map([[1, ‘x’], [2, ‘y’], [3, ‘z’]]); for(var x of a){//Array alert(x)}for(var x of s){//Set alert(x)}for(var x of m){//Mapalert(x[0]+'='+x[1]);
for...ofとfor...inの違い:for...inループは履歴に問題が残っているため、実際にはオブジェクトの属性名を遍歴しています.Array配列は、実際にはオブジェクトでもあり、各要素のインデックスは属性とみなされます.var a = [‘A’, ‘B’, ‘C’]; a.name = ‘Hello’; for(var x in a){alert(x);//‘0’,‘1’,‘2’,‘name’}より良い方法:iterable内蔵forEach方法:var a=[‘A’,‘B’,‘C’];a.forEach(function(element,index,array){//element:現在の要素の値//index:現在のインデックス//array:Arrayオブジェクト自体alert(element);//'A','B','C'});
12.遍歴配列と接合json配列では、多くの異なる方法が試みられている.
13.dataデータとラベルの3元表示を組み合わせて、要素の非表示表示表示表示とスタイルを制御し、切り替えと選択処理を行い、タイムリーなクリアが必要で、カバーを避け、データ層の操作に注目する.
14スクリプトエラーまたはPage()を正しく呼び出す解決策//ページ内の.jsファイルに追加
Page({
}) export default class pageIndex extends wepy.page {
}または
15.globalData={userInfo:null,token:-1}例は共通クラスの値をとる.root. r o o t . parent.globalData.token
16 wx.navigateToは、ページスタックサイズが5 wxになるまでページスタックサイズを増加する.redirectToはページスタックサイズwxを増加する.navigateBackでは、ページスタックのサイズが1になるまでページスタックのサイズを減らします.異なるページの機能に対して、リダイレクトまたは戻る操作が必要な場合は、適宜インタラクティブに使用します.//onePage.wpy onShow()/アドレス操作後if(this.isBack){this.initPageData(this.tokenId)}}wx.navigateTo({ url:
/pages/main/addrForm?addrId=${id}&token=${tokenId} , success: () => { that.isBack = true } }) //another.wpy wx.navigateBack({delta:1})に遭遇する場合、出現した上位ページに戻る場合、リフレッシュ操作を満たすために余分なページが発生しない、ジャンプ時に上記操作を通過すると、戻るボタンをクリックするときにwxを利用する.navigateBack({delta:1})操作は、デフォルトで返される前のページで、再ロードを回避してonShowでリフレッシュ操作を完了し、ページスタックが5層psを超えないようにすることができます:通常、onLoadはonShowより先にロードされますが、ページに戻った後、ページはロードが完了し、onShowが先に現れるので、この周期で非同期リフレッシュ操作を行うことができます.17.現在、データの単一双方向バインドが流行しており、ウィジェットは一方向データストリームを使用しており、従来のjQuery方式でデータとビューを操作すれば、開発効率が低く、開発者は購入しない.双方向データストリームを使用すると、プログラムの実行効率が低く、論理層オブジェクトの状態が制御できません.全体的に、ウィジェットデータビューは開発モードを一方向にバインドし、開発者にイベント処理に専念させ、オブジェクトの状態を変更し、ビューの更新を実現させる.
18.ウィジェットのオリジナルドロップダウンを禁止json構成の「enablePullDownRefresh」:false
19.【ウィーチャットウィジェット】画像のロードは成功したが、コンソールはレンダーレイヤネットワーク層のエラーを報告する
Thu May 03 2018 21:14:20 GMT+0800(中国標準時間)レンダーレイヤネットワーク層エラーVM 27762:2 Failed to load local image resource/goods/.png the server responded with a status of 404(HTTP/1.1 404 Not Found)エラーの原因は、ページがロードされたばかりのとき、imageの値が空であるため、画像のロードに成功したのは、バックグラウンドの値がエラーを解決する方法を伝え、imageにデフォルト値を設定したり、wxを使用するためである.if条件レンダリングコンポーネント