微信小程序中navigator页面链接标签的使用

153 阅读2分钟

页面链接。类似于a标签。官方文档

  1. navigator 在 Skyline 下视为文本节点,只能嵌套文本节点(如 text),不能嵌套 view、button 等普通节点。
  2. 新增 span 组件用于内联文本和图片,如<span> <image> </image> <navigator>bar</navigator> </span>

navigator属性

  1. target:在哪个目标上发生跳转,默认self当前小程序,miniProgram其它小程序。
  2. url:当前小程序内的跳转链接。
  3. open-type:跳转方式。
  4. delta:当 open-type 为 'navigateBack' 时有效,表示回退的层数,默认1。
  5. app-id:当target="miniProgram"open-type="navigate"时有效,要打开的小程序 appId。
  6. path:当target="miniProgram"open-type="navigate"时有效,打开的页面路径,如果为空则打开首页。
  7. extra-data:当target="miniProgram"open-type="navigate/navigateBack"时有效,需要传递给目标小程序的数据对象形式,目标小程序可在 App.onLaunch()App.onShow() 中获取到这份数据。
  8. version:当target="miniProgram"open-type="navigate"时有效,要打开的小程序版本。默认release正式版、develop开发版、trial体验版。
  9. short-link:当target="miniProgram"时有效,当传递该参数后,可以不传 app-id 和 path。链接可以通过【小程序菜单】->【复制链接】获取。
  10. hover-class:指定点击时的样式类,默认navigator-hover,none没有点击态效果。
  11. hover-stop-propagation:指定是否阻止本节点的祖先节点出现点击态,默认false。
  12. bindsuccess:当target="miniProgram"open-type="navigate/navigateBack"时有效时有效,跳转小程序成功出现的文字提示。
  13. bindfail:当target="miniProgram"open-type="navigate/navigateBack"时有效时有效,跳转小程序失败出现的文字提示。
  14. bindcomplete:当target="miniProgram"open-type="navigate/navigateBack"时有效时有效,跳转小程序完成出现的文字提示。

open-type的值

跳转方式,默认navigate

  1. navigate:保留当前页面后转跳,所以有返回上一级,不能跳tabBar。
  2. redirect:销毁当前页面后转跳,所以没有返回上一级,不能跳tabBar。
  3. switchTab:销毁当前页面后转跳tabBar页面,不能转跳非tabBar页面。
  4. reLaunch:销毁所有页面后转跳,所以没有返回上一级。可以跳tabBar。
  5. navigateBack:返回上一页或多级页面,默认一级,根据delta属性。
  6. exit:退出小程序,target="miniProgram"时生效。