一、使用第三方组件库

电商平台参考文档 （vantweapp）

Vant Weapp 是移动端 Vue 组件库 Vant 的小程序版本，两者基于相同的视觉规范，提供一致的 API 接口，助力开发者快速搭建小程序应用。

1.安装

// 使用如下命令安装淘宝镜像源cnpm 
npm install -g cnpm --registry=https://registry.npm.taobao.org
# 通过 npm 安装
cnpm init / npm init
cnpm i @vant/weapp -S --production

2.构建 npm 包

打开微信开发者工具，点击 工具 -> 构建 npm，并勾选 使用 npm 模块 选项，构建完成后，即可引入组件

3.使用组件

在 app.json 中去除 "style": "v2" 小程序给新版基础组件强行加上了许多样式，难以去除，不关闭将造成样式混乱。

4.商品详情页使用业务组件 - GoodsAction 商品导航

参考链接 GoodsAction 商品导航

// pages/detail/detail

{
  "usingComponents": {
    "van-goods-action": "/miniprogram_npm/@vant/weapp/goods-action/index",
    "van-goods-action-icon": "/miniprogram_npm/@vant/weapp/goods-action-icon/index",
    "van-goods-action-button": "/miniprogram_npm/@vant/weapp/goods-action-button/index"
  }
}