在Vue项目中使用Vant组件库时遇到了ActionSheet组件的引用错误。问题源于Vant的ActionSheet在不同版本间命名存在差异：新版本为`ActionSheet`，旧版本为`Actionsheet`。同时，对应的HTML标签名也不同，新版本为`van-action-sheet`，旧版本为`van-actionsheet`。解决办法是确保import和Vue.use时版本对应，并使用正确的标签名称。
项目场景：
今天在使用到vant组件的时候引入报错。
[Vue warn]: Unknown custom element: <van-action-sheet> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
原因分析：
vant的ActionSheet 动作面板，v1、v2新旧版本不一样，名字都不一样。这可太细了。
ActionSheet // 新版本
Actionsheet // 旧版本
import和use的时候要注意，版本不对应就拉了。
import { Actionsheet } from "vant"; // 旧版本
Vue.use(Actionsheet)
import { ActionSheet } from "vant"; // 新版本
Vue.use(ActionSheet)
而且标签名也不一样：
van-action-sheet // 新版本
van-actionsheet // 旧版本
扫一扫
1万+
到【灌水乐园】发言
