Vant Weapp如何集成Vant中Sku组件

1.主要参考下面GitHub项目

https://github.com/jiangrubin/weapp-sku

2.下载下来解压后，需要安装对应的Vant-Weapp

npm i @vant/weapp -S --production

2.1 有可能导入的vant-weapp的版本不同会导致sku对应引用的其他组件找不到，那就要根据项目路径自行调整路径

3.使用微信开发者工具导入该项目，下面是对应的效果和目录结构

4.现在考虑如何导入真实项目中

4.1 将Demo的文件对应的导入下图的目录下

4.2、在app.json 注册自定义的sku组件

5.在对应要使用sku组件的页面中使用

5.1、在页面json文件中引入使用

5.2 在页面wxml中直接使用

<sku
  show="{{ showSku }}"
  sku-tree="{{ skuTree }}"
  sku-list="{{ skuList }}"
  picture="{{ skuPicture }}"
  price="{{ skuPrice }}"
  stock="{{ skuStock }}"
  bind:close="onCloseSku"
  bind:add-cart="onSkuAddCart"
  bind:buy="onSkuBuy"
/>