【问题标题】:react native click highlighted word反应原生点击突出显示的单词
【发布时间】:2019-01-29 06:04:58
【问题描述】:

我正在使用 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}
         />
      )}
}

感谢任何帮助。谢谢。

【问题讨论】:

    标签: reactjs react-native react-native-ios


    【解决方案1】:

    您可以通过在 file as 中提供额外的 prop - onPress 来分叉和修改库代码

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

    以后用它作为

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

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2018-07-21
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-08-07
      • 2012-09-28
      • 2017-12-01
      相关资源
      最近更新 更多