https://github.com/graforlock/choo-detached

A wrapper around choo API that allows to use choo components without a baked-in routing layer.
https://github.com/graforlock/choo-detached

Last synced: 1 day ago
JSON representation

A wrapper around choo API that allows to use choo components without a baked-in routing layer.

• Host: GitHub
• URL: https://github.com/graforlock/choo-detached
• Owner: graforlock
• License: mit
• Created: 2017-09-24T12:44:47.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2018-02-05T12:32:29.000Z (almost 7 years ago)
• Last Synced: 2024-08-02T19:37:11.979Z (3 months ago)
• Language: JavaScript
• Homepage:
• Size: 7.81 KB
• Stars: 19
• Watchers: 2
• Forks: 5
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

• awesome-choo - choo-detached - Use `choo` as a mountable, simple stand-alone component (no routing). (Uncategorized / Uncategorized)

README

        
## choo-detached

[![npm version](https://badge.fury.io/js/choo-detached.svg)](https://badge.fury.io/js/choo-detached) 

A wrapper around choo API that allows to use choo components without a baked-in routing layer. 

[![JavaScript Style Guide](https://cdn.rawgit.com/standard/standard/master/badge.svg)](https://github.com/standard/standard)

## Example

```javascript

var choo = require('choo-detached')

var html = require('choo-detached/html')

var log = require('choo-log')

var app = choo()

app.use(log())

app.use(countStore)

app.component(mainView)

app.mount('body')

function mainView (state, emit) {

  return html`

    

      
count is ${state.count}

      Increment

    

  `


  function onclick () {

    emit('increment', 1)

  }

}

function countStore (state, emitter) {

  state.count = 0

  emitter.on('increment', function (count) {

    state.count += count

    emitter.emit('render')

  })

}

```