vant组件之van-popover气泡框结合list数组列表循环使用

最新推荐文章于 2024-09-25 16:11:03 发布

火火火火_Shy

最新推荐文章于 2024-09-25 16:11:03 发布

阅读量1w

点赞数 4

分类专栏： vant 文章标签： vant

本文链接：https://blog.youkuaiyun.com/yangmy_Shy/article/details/114525501

版权

本文介绍如何在Vant框架中结合van-popover气泡框和list数组进行列表循环展示，同时讲解了如何使用stopUrlHref方法阻止父元素点击事件，避免页面意外跳转。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 <van-col span="6" class="dzmyBulk_xmCol" @click="stopUrlHref">
                                            <p class="font14 color7BA">每吨利润(万)</p>
                                            <van-popover v-model="showPopoverFlag[index]" placement="bottom-start" trigger="click" theme="light">
                                                <p class="font14" style="padding: 0 12px;">{
  {item.tonProfit}}元</p>
                                                <template #reference>
                                                    <p class="font16 color555" style="margin: 0 0">{
  {item.tonProfit==='' || item.tonProfit===null ? '--' :item.tonProfit}}</p>
                                                </tem