反应本机点击突出显示的词

Question

我正在使用 react-native-highlight-words 在我的 react-native 应用程序中突出显示标签词。它正确地突出显示了所需的单词，但我也想让它可以点击，但这个库没有提供。意味着当我点击 #positivewibes 单词时，它会将我重定向到另一个页面。我已经上传图片以供参考here。

我的代码

import Highlighter from 'react-native-highlight-words';

export default class LikeComponent extends Component {
    constructor(props) {
        super(props);
        this.state = {
            highlightWordArray: []
        };
    }
    componentDidMount() {
        postText = this.props.postData.details;
        var regexp = new RegExp('#([^\s]*)','g');
        postText = postText.match(regexp);
        if(postText != null) {
            this.setState({highlightWordArray: postText});
        }
    }
    render() {
       return (
         <Highlighter
           highlightStyle={{color: 'red'}}
           searchWords={this.state.highlightWordArray}
           textToHighlight= {this.props.postData.details}
         />
      )}
}

感谢任何帮助。谢谢。

Answer 1

您可以通过在 file as

中提供额外的道具 - onPress 来分叉和修改库代码

<Text 
   onPress={props.onPress}
   key={index}
   style={chunk.highlight && highlightStyle}
>
  {text}
</Text>

以后用作

<Highlighter
   ...// other props
   onPress={// your redirect instance}
/>

反应本机点击突出显示的词

react native click highlighted word

reactjs

react-native

react-native-ios