https://github.com/zackify/react-slug

A React component that will turn any input into a URL friendly slug!
https://github.com/zackify/react-slug

Last synced: 4 months ago
JSON representation

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

• Host: GitHub
• URL: https://github.com/zackify/react-slug
• Owner: zackify
• Created: 2015-02-28T00:59:33.000Z (about 11 years ago)
• Default Branch: master
• Last Pushed: 2015-06-04T23:56:33.000Z (almost 11 years ago)
• Last Synced: 2025-03-17T08:21:28.095Z (12 months ago)
• Language: JavaScript
• Homepage:
• Size: 895 KB
• Stars: 23
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
##React Slug

![gif demo](https://s3.amazonaws.com/f.cl.ly/items/2N330o430g3g2s2e0S0E/Screen%20Recording%202015-02-27%20at%2005.02%20PM.gif)

##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.

~~~js

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 

  }

}

~~~

###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](http://github.com/jedwatson) for the gulpfile stuff ;)