1.3.0 • Published 10 years ago

virtual-widget v1.3.0

Weekly downloads
2
License
MIT
Repository
github
Last release
10 years ago

virtual-widget

NPM version build status Test coverage Downloads js-standard-style

Create a virtual-dom widget.

Installation

$ npm install virtual-widget

Usage

// map.js
const virtualWidget = require('virtual-widget')

module.exports = virtualWidget({
  init: function (state) {
    this.state = state
    var elem = document.createElement('div')
    this.map = GoogleMap(elem)
    this.map.setPosition(this.state.position)
    return elem
  },
  update: function (prev, el) {
    this.map = this.map || prev.map
    this.map.setPosition(this.state.position)
  },
  destroy: function (el) {
    // clear position
    this.state.position.set({ x: 0, y: 0 })
  }
})
// view.js
const map = require('./map')

module.exports = view

function view (h, state) {
  return h('section.foo', [
    map(state)
  ])
}

API

render = virtualWidget(hooks)

Create a new virtual-widget using hooks. The following hooks are available:

  • init: run when the element is first created. Define the instantiation logic here.
  • update: run on a re-render. Gives a chance to update state.
  • destroy: run before the widget is unmounted. It is passed the HTMLElement associated with the widget that will be removed. Generally used to clean up data and remove hooks.
  • render: return a string of HTML for server side rendering. It's recommended to use vdom-to-html for server-side rendering.

See Also

License

MIT

1.3.0

10 years ago

1.2.2

10 years ago

1.2.1

10 years ago

1.2.0

10 years ago

1.1.2

10 years ago

1.1.1

10 years ago

1.1.0

10 years ago

1.0.0

10 years ago