WeEngineフレームワークにおけるメニューシステムのデータ構造と実装パターン

メニューシステムのデータ永続化はims_modules_bindingsテーブルで管理される。WeChatミニプログラムのフロントエンドで利用されるuniacidは、管理画面のURLパラメータから取得可能(クリックせずにマウスオーバーで確認)。
主要テーブルの関係性:
  • ims_account_wxapp:アカウント固有のaciduniacidを管理
  • ims_modules:モジュール基本情報
  • ims_modules_bindings:モジュールとメニューのバインディング情報
整数値検証の実装例:
const integerRegex = /^\d+$/;
if (!integerRegex.test(REQUEST_PARAMS.timeout)) {
  showNotification('タイムアウト設定が無効です', 'error');
  return;
}
このパターンは/www/wwwroot/project/framework/function/global.phpに実装される共通関数として再利用可能。
設定ファイルの配置:
  • グローバル設定:/www/wwwroot/project/data/config.php
  • 環境依存設定:siteinfo.jssiteroot値(一部ドメインでは/app/index.phpを含む必要あり)
認証エラーのトラブルシューティング:
  1. WeChat開発者センターの「JSセキュリティドメイン」と「OAuth2.0リダイレクトドメイン」の設定確認
  2. WeEngine管理画面のアカウント有効期限チェック
  3. ミニプログラムの「業務ドメイン」と「合法ドメイン」の整合性検証
動的オーダーリストのレンダリング実装:
<script type="text/template" id="orderTemplate">
{{ items.forEach(item => { }}
  <section class="order-card">
    <header class="store-header">
      <span class="store-name"><i class="icon-store"></i> {{ item.shop }}</span>
      {{ if (item.refundRequest) { }}
        <span class="status-badge refund-pending">返金申請中</span>
      {{ } else { }}
        <span class="status-badge">{{ getStatusLabel(item.state) }}</span>
      {{ } }}
    </header>
    
    <a href="{{ item.detailUrl }}" class="order-item">
      <img src="{{ item.thumbnail }}" class="product-thumb">
      <div class="product-info">
        <div class="product-title">{{ item.name }}</div>
        <div class="order-meta">
          <span class="price">¥{{ item.amount }}</span>
          <time class="order-time">{{ item.timestamp }}</time>
        </div>
      </div>
      <i class="icon-chevron"></i>
    </a>

    <footer class="action-footer">
      {{ if (item.state === 0) { }}
        <button onclick="payOrder('{{ item.orderId }}')">支払い</button>
      {{ } }}
      {{ if (item.state === 2) { }}
        <button onclick="reviewOrder('{{ item.orderId }}')">評価</button>
      {{ } }}
    </footer>
  </section>
{{ }) }}
</script>
レンダリングロジック:
function renderOrders(dataSet) {
  if (dataSet.isEmpty()) {
    toggleLoader(false);
    showEndOfList();
    return;
  }

  const template = document.querySelector('#orderTemplate').innerHTML;
  const htmlContent = Mustache.render(template, { items: dataSet });
  document.querySelector('.order-container').insertAdjacentHTML('beforeend', htmlContent);
  
  currentPage++;
  isProcessing = false;
}
カスタムモジュール開発時の注意点:
  • テンプレートパスの解決はモジュール名空間を明示的に指定(例:merchant/views/header
  • メニュー構造の取得はキャッシュ機構を経由し、データベースアクセスを最適化
  • 状態管理コードは列挙型で実装し、数値リテラルの直接使用を避ける

タグ: WeEngine PHP WeChatMiniProgram TemplateEngine RESTfulAPI

6月24日 19:57 投稿