vant weapp: 关于在微信小程序中使用vant weapp的popup弹出层不生效

根据官方的文档，先在app.json或者index.json中引入组件。

"usingComponents": {
  "van-popup": "@vant/weapp/popup/index"
}

然后在视图层wxml文件中添加

<van-cell title="展示弹出层" is-link bind:click="showPopup" />

<van-popup show="{{ show }}" bind:close="onClose">内容</van-popup>

在js文件中添加以下代码

Page({
  data: {
    show: false,
  },

  showPopup() {
    this.setData({ show: true });
  },

  onClose() {
    this.setData({ show: false });
  },
});

但是此时页面并没有使用成功。

仔细观察发现，官方案例中还使用了ban-cell，也需要在组件注册时注册

<van-cell title="展示弹出层" is-link bind:click="showPopup" />

只需要在app.json或者index.json中再添加一下代码即可

"usingComponents": {
  "van-cell": "@vant/weapp/cell/index"
}

运行效果