微信小程序实现跳转到tabbar页面的指定位置

Question

微信小程序怎么用js实现从tab页面A跳转到另一tab页面B中的某个盒子上（注：跳转动态路径。如下：）
希望详细一点，怕看不懂。

图一、页面A

图二、页面A的wxml

图三、页面B的wxml

Answer 1

index页面

<view>
  <view
    wx:for="{{list}}"
    wx:key="index"
    data-item="{{item}}"
    class="list-item"
    bindtap="toImage">
    跳转到tab上指定图片{{item.code}}上
  </view>
</view>

const app = getApp()

Page({
  data: {
    list: [
      { code: 1, name: '给梵蒂冈法国广泛大概' },
      { code: 2, name: '官方哥特人特多' },
      { code: 3, name: '风格非常vv现场v的' }
    ]
  },
  // 点击跳转
  toImage(e) {
    // switchTab不支持传参，我们这里通过globalData来传递
    const { item } = e.currentTarget.dataset
    app.globalData.imgCode = item.code
    wx.switchTab({
      url: `/pages/my/index`
    })
  }
})

my页面

<scroll-view class="wrap" style="height: 100vh;" scroll-y scroll-into-view="{{imgContainer}}" scroll-with-animation>
  <view
    wx:for="{{imgList}}"
    wx:key="index"
    id="img_{{item.code}}"
    class="img-item">
    图片{{item.code}}
  </view>
</scroll-view>

const app = getApp()

Page({

  /**
   * 页面的初始数据
   */
  data: {
    imgList: [
      { code: 1, url: '' },
      { code: 2, url: '' },
      { code: 3, url: '' }
    ],
    imgContainer: ''
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    const { imgCode } = app.globalData
    const imgContainer = imgCode ? `img_${imgCode}` : null
    this.setData({
      imgContainer
    })
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {
    // 离开清空
    app.globalData.imgCode = null
  },
})