store miniprogram
1.0.0
Hace algún tiempo, creé un sitio web de centro comercial para PC que imitaba a Xiaomi Mall. Recientemente leí la documentación del mini programa WeChat, así que comencé a crear una versión del mini programa WeChat.
Este proyecto reutiliza el backend de vue-store y agrega la API de inicio de sesión del subprograma WeChat basada en el servidor de tienda original.
Utilizo mi tiempo libre en clases en línea para aprender y hacerlo al mismo tiempo. Es un poco difícil. Si tiene alguna pregunta o buena sugerencia, no dude en enviar problemas.
Dado que se realiza con una cuenta de prueba, no existe una versión preliminar en línea.
Versión web para PC: vue-store.
Backend: servidor-tienda.
Si cree que este proyecto es bueno, puede hacer clic en
Staren la esquina superior derecha para apoyarlo. ¡Gracias! ^_^
Para distinguir el mini programa oficial de Xiaomi Mall, llamé a este proyecto Xiaomi. Este proyecto no tiene nada que ver con el sitio web oficial de Xiaomi. Es un proyecto puramente personal. Si necesita comprar productos Xiaomi, vaya a la tienda oficial de Xiaomi.
El proyecto contiene 4 barras de pestañas: página de inicio, página de descubrimiento (es decir, página de visualización del producto), carrito de compras y mía. También hay una página de detalles del producto, mi colección, una página de liquidación de pedidos y mi pedido.
Realiza visualización de productos, consulta de clasificación de productos, búsqueda de productos por palabras clave, visualización de información detallada del producto, carrito de compras de usuarios, liquidación de pedidos, pedidos de usuarios y lista de recopilación de usuarios.
El proyecto en su conjunto se refiere a la implementación de vue-store y básicamente implementa todas sus funciones. Se puede decir que es su versión del subprograma WeChat.
El backend reutiliza el backend de vue-store y agrega la API de inicio de sesión del subprograma WeChat según el servidor de tienda original.
Front-end: subprograma nativo de WeChat
Backend: Node.js , Koa框架
Base de datos: Mysql
Cuando se inicia el subprograma, llama a wx.login para obtener las credenciales de inicio de sesión ( código ), luego envía el código de regreso al servidor back-end del proyecto, llama a la interfaz auth.code2Session e intercambia el identificador único OpenID del usuario y la clave de sesión. clave_sesión . Luego registre OpenID en la base de datos del proyecto para generar un ID de usuario único para este sistema, que se utiliza para la verificación comercial en este proyecto.
La página de inicio sirve principalmente para mostrar productos, con un carrusel que muestra productos recomendados, una cuadrícula de nueve cuadrados de categorías de productos populares y una visualización de productos populares por categoría.
La página de todos los productos integra la visualización de todos los productos, la consulta de clasificación de productos y la visualización de resultados de búsqueda de productos según palabras clave.
La página de detalles del producto muestra principalmente la información detallada de un determinado producto, donde los usuarios pueden agregar sus productos favoritos al carrito de compras o a la lista de favoritos.
El carrito de compras utiliza omix para la gestión del estado global, que permite funciones como agregar, eliminar, aumentar la cantidad de artículos en el carrito de compras, seleccionar artículos para liquidación y seleccionar todos los artículos en el carrito de compras para liquidación.
Después de que el usuario seleccione el producto que desea comprar en el carrito de compras y haga clic en el botón "Ir a pagar", accederá a esta página. Aquí el usuario selecciona la dirección de entrega, confirma la información relevante sobre el pedido y luego confirma la compra.
Los usuarios pueden agregar sus productos favoritos a la lista de favoritos haciendo clic en el botón Agregar Me gusta en la página de detalles del producto.
Mostrar todos los pedidos realizados por el usuario.
请clone项目到本地
git clone https://github.com/hai-27/store-miniprogram.git
导入项目到微信开发者工具即可
Autor hai-27
31 de marzo de 2020
