tdesign miniprogram starter retail Télécharger - tdesign miniprogram starter retail Téléchargement du code source

tdesign miniprogram starter retail

Code Source AI

1.0.0

Télécharger

Exemple d'applet de modèle pour le secteur de la vente au détail TDesign

L'exemple d'applet de modèle de vente au détail TDesign est construit à l'aide de la solution d'applet du système de conception de niveau entreprise TDesign et s'appuie sur la bibliothèque de composants d'applet TDesign WeChat pour couvrir toutes les exigences de base du scénario de vente au détail.

? Aperçu

Veuillez utiliser WeChat pour scanner le code QR suivant :

?Présentation du projet

1. Présentation de l'entreprise

L'applet modèle du secteur de la vente au détail est une applet de commerce électronique classique à magasin unique, couvrant le processus de lien d'or du commerce électronique, depuis les produits -> panier -> règlement -> commandes, etc. Le mini programme contient un total de 28 pages complètes, couvrant les pages de base telles que la page d'accueil, la page de détails du produit, le centre personnel et le processus après-vente. En utilisant des données fictives pour l'affichage, il fournit un processus complet d'affichage, de transaction et d'après-vente des produits de vente au détail. Détails des pages :

Les captures d'écran des pages principales sont les suivantes :

2. Composition du projet

L'applet du modèle du secteur de la vente au détail est construite à l'aide de JavaScript + WXSS + ESLint de base, ce qui abaisse le seuil d'utilisation.

La structure du répertoire du projet est la suivante :

 |-- tdesign-miniprogram-starter
    |-- README.md
    |-- app.js
    |-- app.json
    |-- app.wxss
    |-- components	//	公共组件库
    |-- config	//	基础配置
    |-- custom-tab-bar	//	自定义 tabbar
    |-- model	//	mock 数据
    |-- pages
    |   |-- cart	//	购物车相关页面
    |   |-- coupon	//	优惠券相关页面
    |   |-- goods	//	商品相关页面
    |   |-- home	//	首页
    |   |-- order	//	订单售后相关页面
    |   |-- promotion-detail	//	营销活动页面
    |   |-- usercenter	//	个人中心及收货地址相关页面
    |-- services	//	请求接口
    |-- style	//	公共样式与iconfont
    |-- utils	//	工具库

3. Simulation de données

Le mini-programme de vente au détail utilise des données d'interface réelles pour simuler la logique de retour back-end et affiche des scénarios d'achat complets et une logique d'expérience d'achat dans le mini-programme.

4. Ajouter une nouvelle page

Créez le dossier de pages correspondant dans le répertoire pages
Ajoutez le chemin de la page au tableau "pages" dans le fichier app.json
[Facultatif] Ajoutez la configuration de la page sous "miniprogram-list" dans le fichier project.config.json

? Construire et exécuter

npm install
Introduire des projets dans de petits outils de développement de programmes
Construire npm

?Contrôle du style de code

eslint prettier

Version de la bibliothèque de base

Version minimale de la bibliothèque de base ^2.6.5

retour

L'équipe TDesign d'Enterprise WeChat Group publiera rapidement les versions et les informations sur la résolution des problèmes dans le groupe Enterprise WeChat, et il y aura également des discussions sur la construction de bibliothèques de composants. Bienvenue pour scanner le code QR sur WeChat ou Enterprise WeChat pour rejoindre le groupe pour la communication. :

E-mail : [email protected]