source-react-coffee
v0.2.2
Published
React in CoffeeScript without escaping into JSX or painfully contorting syntax.
Readme
This is an attempt to make Facebook's react library more usable from CoffeeScript without escaping into JSX or painfully contorting syntax. Here's what I have so far.
{React, Component, renderComponent} = require 'react-coffee'
class TodoList extends Component
render: ->
@ul ->
@li text for text in this.props.items
class TodoApp extends Component
getInitialState: ->
items: []
text: ''
onChange: (e) =>
@setState(text: e.target.value)
handleSubmit: (e) =>
e.preventDefault()
nextItems = @state.items.concat([@state.text])
nextText = ''
@setState(items: nextItems, text: nextText)
@refs.nameInput.getDOMNode().focus()
render: ->
@div ->
@h3 'TODO'
@component TodoList, items: @state.items
@form onSubmit: @handleSubmit, ->
@input onChange: @onChange, ref: 'nameInput', value: @state.text
@button "Add ##{@state.items.length + 1}"
component = new TodoApp()
renderComponent(component, document.getElementById('app'))