Need help with polymer-redux?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

tur-nr
451 Stars 72 Forks MIT License 173 Commits 30 Opened issues

Description

Polymer bindings for Redux.

Services available

!
?

Need anything else?

Contributors list

No Data

Polymer Redux

Build Status Coverage Status

Polymer bindings for Redux. Bind store state to properties and dispatch actions from within Polymer Elements.

Polymer is a modern library for creating Web Components within an application. Redux is a state container for managing predictable data. Binding the two libraries together allows developers to create powerful and complex applications faster and simpler. This approach allows the components you build with Polymer to be more focused on functionality than the applications state.

Polymer 3

Polymer 3 is currently under beta release, checkout: https://github.com/tur-nr/polymer-redux/tree/dev/v2.x

Installation

bower install --save polymer-redux

Example

// Create a Redux store
const store = Redux.createStore((state = {}, action) => state)

// Create the PolymerRedux mixin const ReduxMixin = PolymerRedux(store)

// Bind Elements using the mixin class MyElement extends ReduxMixin(Polymer.Element) { static get is() { return 'my-element' }

connectedCallback() {
    super.connectedCallback();
    const state = this.getState();
}

}

// Define your Element customElements.define(MyElement.is, MyElement)

Now

MyElement
has a connection to the Redux store and can bind properties to it's state and dispatch actions.

Documentation

See the documentation page: https://tur-nr.github.io/polymer-redux/docs.

API

PolymerRedux

new PolymerRedux()
  • store
    Object, Redux store.

Returns a

ReduxMixin
function.

Redux Mixin

These methods are available on the instance of the component, the element.

#getState()

Returns current store's state.

#dispatch(, [args, ...])
  • name
    String, action name in the actions list.
  • arg...
    *, Arguments to pass to action function.

Returns the action object.

#dispatch()
  • fn
    Function, Redux middleware dispatch function.

Returns the action object.

#dispatch()
  • action
    Object, the action object.

Returns the action object.

Events

state-changed

Fires when the store's state has changed.

License

MIT

Copyright (c) 2017 Christopher Turner

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.