react-highlight-hashtags

react-highlight-hashtags is component for React to check hashtags in text.

Installation

Using npm:

$ npm install --save react-highlight-hashtags

Then, use as you would anything else:

// using ES modules
import Hashtags from 'react-highlight-hashtags';
 

Basic usage

Render a <Hashtags> component with ot without a text prop whose value is a valid text. The children prop should be a text.

import React from 'react';
import Hashtags from 'react-highlight-hashtags';
 
class App extends React.Component {
  render() {
    return (
        <Hashtags> Hi, #highlight #hash tags</Hashtags>
    );
  }
}

import React from 'react';
import Hashtags from 'react-highlight-hashtags';
 
class App extends React.Component {
  render() {
    return (
        <Hashtags text="Hi, #highlight #hash tags" />
    );
  }
}

props

There is only one optional props.

style

If you are using bootstrap then mark tag will appear in yellow background.

mark {
    background:none;
    color:rgb(250, 93, 58);
    cursor:pointer;
}

About

react-highlight-hashtags is developed and maintained by Krishna Kumar.