1. app.jsonを使用してページを作成する私たちの通常の開発習慣によれば、新しいページを作成するときは、通常、最初にフォルダーを作成し、次に対応するページを作成します。作成が完了すると、ページは自動的に app.json に登録されます。実際、app.json にページを直接登録することで、対応するページを生成することもできます。 「ページ」: [ 「ページ/インデックス/インデックス」、 「ページ/新しいページ/新しいページ」 ]、 上記のように、設定ファイルにパスを登録すると、アプレットは対応するパスを自動的に作成します。 2. コンパイルモードを有効活用するページをデバッグしたい場合、多くの開発者は app.json を直接変更して最初のスタック ページを調整することに慣れています。実際、構成ファイルを変更する代わりに、コンパイル モードを使用してコンパイル ページを追加できます。 3. コンポーネント再利用ミニプログラムスタイル新しいコンポーネントが作成されると、アプレットはこの構成項目を表示しないため、この点は忘れられがちです。以下のようにオプションを設定すると、コンポーネントはグローバルスタイル(app.wxss)を使用できます。 成分({ //colorui スタイル オプションを継承: { グローバルクラスを追加: true、 複数スロット: true }, ... } 4. app.js 初期化コンテンツの機能化多くのミニプログラムには onLaunch で記述されたコンテンツが多数含まれており、非常に混乱を招き、後のデバッグが特に困難になります。異なる初期化内容を異なる関数として記述することができ、関数化およびモジュール化されます。 onLaunch: 関数(オプション) { //ここでアプレットに入る方法を処理する必要があります this.InitCloud(); //クラウドサービスを初期化します/ ESC this.InitCustom(); //カスタムに必要な構成情報を初期化します this.InitEdu(); //教育システムの構成を初期化します}, 5. テンプレートを有効活用する繰り返しコンテンツが多い wxml コンテンツの場合は、テンプレート ファイルに抽出し、使用時に直接インポートすることができます。 <import src="テンプレート/NexuTemplate.wxml"/> <view wx:for="{{dirlist}}" wx:key="item"> <template is="dirshow" data="{{item}}"></template> </ビュー> 6. クラウド開発とハイブリッド開発コンテンツセキュリティの識別、OpenIDの取得、画像ポルノの検出、支払い処理、コンテンツのプッシュなどは、独自のバックエンドを使用して実装するとそれほど簡単ではありません。ただし、クラウド開発技術を使用してこの部分を置き換え、ビジネスロジックに重点を置くと、新しい世界が開かれます。 クラウド開発の機能の一部(クラウド開発とハイブリッド開発の内容を紹介する特別記事を後日書きます): const クラウド = require('wx-server-sdk') クラウド.init({ 環境: cloud.DYNAMIC_CURRENT_ENV }) // クラウド関数エントリ関数 exports.main = async (event, context) => { // コンソール.log(イベント) スイッチ (イベント.アクション) { ケース 'getWXACode': { getWXACode(イベント)を返す } ケース 'getOpenData': { getOpenData(イベント)を返す } ケース 'msgSecCheck': { msgSecCheck(イベント)を返す } ケース 'imgSecCheck': { imgSecCheck(イベント)を返す } ケース 'submitPages': { 送信ページを返す(イベント) } デフォルト: { 戻る } } } //アプレットコードを取得する async function getWXACode(event) { コンソールログ(イベント.url) // ここで永続的で有効なアプレットコードを取得し、クラウドファイルストレージに保存し、最後にフロントエンドが使用するクラウドファイルIDを返します。const wxacodeResult = await cloud.openapi.wxacode.get({ パス: event.url || 'pages/index/index', }) 定数 fileExtensionMatches = wxacodeResult.contentType.match(/\/([^\/]+)/) 定数ファイル拡張子 = (ファイル拡張子マッチ && ファイル拡張子マッチ[1]) || 'jpg' const uploadResult = cloud.uploadFile({ // クラウド ファイル パス。デモンストレーションの目的で、ここでは固定名が使用されています: cloudPath: `wxCode/wxCode${Math.random() * 9999999}.${fileExtension}`、 // アップロードするファイルの内容は、画像バッファに直接渡すことができます ファイル内容: wxacodeResult.buffer、 }) アップロード結果ファイルIDが 新しいエラーをスローします(`アップロードに失敗しました。ファイルが空です。ストレージ サーバーのステータス コードは空です ${uploadResult.statusCode}`) } uploadResult.fileIDを返す } // openid を取得 非同期関数 getOpenData(イベント) { // wx-server-sdk >= 0.5.0 が必要です 定数 wxContext = cloud.getWXContext() 戻る { イベント、 オープンID: wxContext.OPENID、 アプリID: wxContext.APPID, ユニオンID: wxContext.UNIONID, } } // テキストが準拠しているかどうかを確認する async function msgSecCheck(event) { // wx-server-sdk >= 0.5.0 が必要です cloud.openapi.security.msgSecCheck({ を返します。 コンテンツ: イベント.コンテンツ、 }) } // 画像が準拠しているかどうかを確認する async function imgSecCheck(event) { cloud.openapi.security.imgSecCheck({ を返します。 メディア: コンテンツタイプ: イベント.コンテンツタイプ、 値: Buffer.from(イベント.値) } }) } //ページを含める async function submitPages(event) { cloud.openapi.search.submitPages({ を返します。 ページ: [{ パス: イベント.パス、 クエリ: イベント.クエリ }] }) } //日付を取得する function getDateTime(sj) { var now = new Date(sj * 1000); var year = now.getFullYear(); var 月 = now.getMonth() + 1; var date = now.getDate(); var hour = now.getHours(); var 分 = now.getMinutes(); // var second = now.getSeconds(); 年 + 「年」 + 月 + 「月」 + 日 + 「日」を返します。 } 7. 個人設定データを1つのファイルに集約するたとえば、変更される可能性はあるが頻繁に使用されるサーバー ドメイン名やインターフェイス トークンなどのデータは、1 つのファイルに集中されます。 モジュール.エクスポート={ クラウドを使用する:true、 CloudId:'', //クラウド開発環境ID TraceUser:true, // ユーザーアクセスログを記録する AdaptStorge:true, // ユーザーデータのキャッシュを許可する SevDomain:'http://localhost' // サーバーのドメイン名} 8. 開発者ツールのバージョン管理ツールを有効活用する要約するこれで、WeChat ミニプログラムの開発をスピードアップするためのヒントに関するこの記事は終了です。WeChat ミニプログラムの開発に関するより関連性の高い提案については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。皆様が今後も 123WORDPRESS.COM を応援してくれることを願っています。 以下もご興味があるかもしれません:
|
<<: Linux nohup はプログラムをバックグラウンドで実行し、表示します (nohup と &)
>>: Windows での MySQL インストール チュートリアル (画像とテキスト付き)
ここ数日、dockerでSpring Bootアプリケーションを実行する方法を勉強してきました。以前...
目次1. ファイルを開くパラメータの紹介2. ファイルの読み取り3. ファイルを書き込む4. 閉じる...
コードをコピーコードは次のとおりです。 <本文<フォームアクション="&quo...
概要MySQL データベースで主キーのないテーブルを表示するための SQL ステートメントをいくつか...
フォーラムでは、ネットユーザーから「HTML ファイル内の別の HTML ファイルの内容を読み取るこ...
1. ROW_NUMBER()定義: ROW_NUMBER() 関数は、select によってクエリ...
なぜ詰まっているのでしょうか?言及しなければならない前提があります。フロントエンド開発者は皆、ブラウ...
データベース アプリケーションは、アプリケーション システムに不可欠な部分です。リレーショナル デー...
どの企業もユーザーベースを拡大したいのであれば、ユーザーの操作データを収集・分析する必要があり、その...
1. 機能紹介sed (Stream EDitor) は、コンテンツを 1 行ずつ処理するストリーム...
このスクリプトは、nginxの起動、停止、再起動の操作を満たすことができます。 #!/bin/bas...
1. ファイル削除コマンド:対応するディレクトリを検索します -mtime + 日数 -name &...
少なくとも 5 冊のベストセラー書籍の順序なしリストを含む HTML ページを作成します。各書籍の前...
目次場合コンテキスト切り替えのオーバーヘッド?要約するCPU は多くの場合、システム パフォーマンス...
目次DragEvent インターフェースデータ転送インターフェースの概要DataTransfer の...