时间戳

首页 > 解决方案 > ReactNative TextView 中的链接

react-native - ReactNative TextView 中的链接

问题描述

我想在 ReactNative TextView 中添加一个外部链接。怎么能做到这一点？

我刚刚尝试过，它正在工作，但我希望所有链接都具有默认颜色。

<Text style={{color: 'blue'}}
      onPress={() => Linking.openURL('http://google.com')}>
  View more details
</Text>

是否有仅用于生成链接的库 ReactNative 库？

标签： react-nativehyperlink

解决方案

嗨，我将制作一个自定义组件，如下所示。

import * as React from 'react'
import {Text} from 'react-native'

export default ({url, text}) => {
  return <Text 
    style={{color: 'blue'}} 
    onPress={() => Linking.openUrl(url)}
  >{text}</Text>
}

然后您可以按如下方式使用它。

import Link from './link' // Where ever it is.
import * as React from 'react'

export default() => {
  return <Link url="http://google.com" text="View more details" />
}

这样你就可以把所有的链接都变成蓝色，以后如果你喜欢黄色，你可以改变一行，所有的链接都会改变颜色。祝你好运，如果有任何不清楚的地方，请告诉我。

推荐阅读