RouterLink

在 router 中没有直接提供类似 vue-router 中的 <router-link /> 的组件式使用方式。

原因:不同小程序中点击事件的绑定方式不同(如微信小程序为bind:tap、支付宝小程序为:onTap),要针对各小程序单独进行封装。在保证包体的大小的情况下,把各小程序的都封装可能不是一个好的做法。

自行实现可在 components 中,用 view 标签包裹后绑定点击事件来调用路由方法即可,以微信小程序为例:

router-link/index.js

import { useRouter } from '@microprogram/router';

Component({
  options: {},
  externalClasses: [],
  properties: {
    to: {
      type: null,
      optionalTypes: [String, Object],
      value: ''
    },
    replace: {
      type: Boolean,
      value: false
    },
    reLaunch: {
      type: Boolean,
      value: false
    }
  },
  data: {},
  methods: {
    handleClick() {
      const { to } = this.data
      if (typeof to === "object") {
        useRouter().push({
          replace: this.data.replace,
          reLaunch: this.data.reLaunch,
          ...to
        })
      } else {
        useRouter().push(to)
      }
    }
  }
})

router-link/index.wxml

<view bind:tap="handleClick">
  <slot></slot>
</view>