react-slug icon indicating copy to clipboard operation
react-slug copied to clipboard

A React component that will turn any input into a URL friendly slug!

##React Slug gif demo

##Install

npm install react-slug

##Example

It acts exactly the same as a regular input, the onChange will return the event as a second parameter.


import React from 'react'
import Slug from 'react-slug'

export default class App extends React.Component{

  constructor(){
    super()
    this.handleChange = this.handleChange.bind(this)
  }

  handleChange(event){
    console.log(event.target.value)
  }

  render(){
    return <Slug value="this will be slugified" onChange={this.handleChange} className="test" />
  }
}

###Rebuilding

Run this to view the example in example/dist

npm run build

###Description

This is a super simple react component that will strip any non alpha-numeric characters for you. It will turn spaces into hyphens. Thanks to Jed Watson for the gulpfile stuff ;)