Link
优质
小牛编辑
134浏览
2023-12-01
描述
- Link 是基础的链接组件,在 Web 容器中通过 a 标签实现,它带有默认样式
textDecoration: 'none'
。
- 使用 Link 组件并不能新开一个 Webview ,它只是在当前的 Webview 中做页面的跳转。
安装
$ npm install rax-link --save
属性
属性 | 类型 | 默认值 | 必填 | 描述 | 支持 |
---|---|---|---|---|---|
onPress | Function | - | ✘ | 节点被点击之后触发 | |
href | String | - | ✔️ | 跳转目标地址 | |
miniappHref | String | - | ✔️ | 跳转类型:跳转地址,例如 navigate:/pages/index/index |
注:
- 基础属性、事件及图片含义见组件概述。
- 小程序中需要通过 miniappHref 属性传递跳转需要的参数,格式为跳转类型:目标地址,跳转类型支持一下几种,默认值为 navigate:
- navigate:从当前页面,跳转到应用内的某个指定页面,
- redirect:关闭当前页面,跳转到应用内的某个指定页面,
- switchTab:跳转到指定标签页(tabbar)页面,并关闭其他所有非标签页页面,
- navigateBack:关闭当前页面,返回上一级或多级页面四种,
示例
基本用法
import Link from 'rax-link';
import Text from 'rax-text';
function App() {
return <Link href={"//www.taobao.com"} onPress={(e)=>{console.log(e)}}>
<Text style={{ fontSize: 14, color: '#333333'}}>
点击跳转
</Text>
</Link>
}