vantUI的sku组件的使用（增加自定义提示信息、自定义按钮获取sku的选中值）

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接： https://blog.csdn.net/weixin_45077505/article/details/100930581

最近在做的移动电商项目，因为vantUI开发商场比较方便，最后决定使用vue结合vantUI结合开发，在使用sku组件的时候遇到了问题，先看一下使用了sku的效果图，

再来看一下设计图

很明显少了一句提示，可能是由于刚接触，对插槽理解的比较浅薄，在这块儿还是卡了一些时间才找的解决方法，只需要写一个插槽来实现就可以了

最后看一下最终效果

补充：

获取选中规格的方法

1、首先给标签添加ref属性

2、在你需要获取规格的事件中直接用this.$refs.(ref的属性值).(官方提供的getSkuData方法)获取就可以了

代码示例如下:

打印结果：