求解Vant-weapp中tabs的问题?

最近在做小程序,需要做一个页面tab滚动的功能,在很多app里面很常见

求解Vant-weapp中tabs的问题?_第1张图片

基于项目里面搭配的样式组件,我采用了https://youzan.github.io/vant-weapp/#/tab,

求解Vant-weapp中tabs的问题?_第2张图片

不同入口进入的时候,都会带一个参数,然后使用setData改变active的值,本以为这样就实现了,但是发现,从不同界面进入的的时候,默认进入的都是data初始化时候active的值,我已经在onload和onshow里面改了active的值,但是还是不行。

好吧,我又参考点击事件的方法,看看值是怎么改变的,然后,我发现了很奇怪的事情。

onchange(e) {

e.detail.name是对应的索引值,但是e.detai.title不是索引值对应的title,不知道是官方就这样封装的还是怎么样。

}

我试着在小程序onload和onshow里面条用点击事件,构造了一个参数

e {
    type: 'change',
    detail:  {
        name: this.data.status,  //入口传过来的值
        title : this.data.title
    }
}

然后执行setData

this.setData({
    active: e.detail.name
})

我心里抱着期待成功实现,但是,又一次被代码打入现实,没有!!!

求问怎么实现页面不同入口调转过来的时候能切换到指定的tab

附上我部分代码

 wxml:

  内容 1
  内容 2
  内容 3
  内容 4

wxjs:
page({
    data : {
        active: 0,
     },
    onLoad(option) {
        const index = option.index   // 跳转页面传来的index
        this.setData({
             active: index   //active 这里官方介绍的是number或string
    }
    onchange(e) {
        this.setData({
            active: e.detail.name
        })
    }
})

 

你可能感兴趣的:(求解Vant-weapp中tabs的问题?)