遇到问题:
点击Popup弹框关闭按钮,弹框的遮罩不能正常关闭,如下图。经研究,排除了popup属性问题,最后只能删除代码排除法。
<!--弹框:选号--> <van-popup v-model="showNumber" closeable round position="bottom" :style="{ height: '73%' }" :close-on-click-overlay="false" > <div class="popupBox"> <van-search v-model="value" show-action placeholder="搜索关键词" @search="onSearch" > <template #action> <div @click="onSearch" class="btn_search">搜索</div> </template> </van-search> <div class="number"> <ul> <li class="active">18888888888</li> <li>18888888888</li> .... </ul> </div> <div class="refresh"> <van-icon name="replay" /><sapn>换一批</sapn> </div> <div class="selected">选中号码:13277705857</div> <div class="bom_btn"> <van-button round size="large">立即购买</van-button> </div> </div> </van-popup>
复制
解决:
原因是搜索框的事件未定义,去掉@search="onSearch"和@search="onSearch"即可。
<van-search v-model="value" show-action placeholder="搜索关键词" @search="onSearch" > <template #action> <div @click="onSearch" class="btn_search">搜索</div> </template> </van-search>
复制
或者在js里定义方法onSearch
methods: { onSearch() { }, }
复制
正常显示如下图: