vant的tab选项卡的点击事件传参

1、在van-tabs上绑定点击事件(getQuestionByTypeid2)

<van-tab title="热榜">
        <div id="hot-list-title">
          <van-tabs
            v-model="typeid"
            sticky
            offset-top="43"
            @click="getQuestionByTypeid2"
          >
            <van-tab
              v-for="item in TypeNameList"
              :title="item.name"
              :name="item.typeid"   //不写就默认为索引下标
              :key="item.typeid"
            >
              <van-grid :column-num="1" :center="false">
                <van-grid-item
                  v-for="(item2, index) in QuestionListByTypeid"
                  :key="index"
                  class="r-q-content"
                >
                  <nuxt-link
                    v-on:click.stop="doThis"
                    :to="
                      `question?id=${item2.questionid}&redirectUrl=%2Fres061401%2Fycc%2Fshop%2Fmobile%2Fquestion%3Fid%3D181${item2.questionid}`
                    "
                  >
                    <div class="r-q-title">
                      {{ item2.title }}
                    </div>
                  </nuxt-link>
                  <div
                    v-html="item2.content"
                    class="q-desc fr-element fr-view"
                  ></div>
                  <div style="color: #999;">
                    <span>{{ item2.answerCount }}&nbsp;热度</span>
                  </div>
                </van-grid-item>
              </van-grid>
            </van-tab>
          </van-tabs>
        </div>
      </van-tab>
 
2、方法
getQuestionByTypeid2(tid, title) {
      window.sessionStorage.setItem('Tid', title)
      console.log(tid) //默认是点击该选项的下标,但是在上面已经给绑定更改name了这里就不会是默认的了 绑定什么值传来就是什么值(item.typeid)
      console.log(title) 
      this.getQuestionByTypeid()
    }
 
在手机端 为防止点击tab选项卡里面的内容跳到新页面返回后默认回到tab选项卡的第一个,可加上target="_blank"
例如:
<nuxt-link
                    v-on:click.stop="doThis"
                    :to="
                      `question?id=${item2.questionid}&redirectUrl=%2Fres061401%2Fycc%2Fshop%2Fmobile%2Fquestion%3Fid%3D181${item2.questionid}`
                    "
                    target="_blank"
                  >
 
posted @   多喝热水,早点睡觉  阅读(9378)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律
点击右上角即可分享
微信分享提示