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
448 Stars 71 Forks MIT License 173 Commits 32 Opened issues

Description

Polymer bindings for Redux.

Services available

!
?

Need anything else?

Contributors list

# 160,901
PHP
decrypt
Laravel
HTML
63 commits
# 92,238
JavaScr...
HTML
web-com...
binding...
5 commits
# 281,976
HTML
web-com...
polymer
Redux
2 commits
# 458,805
HTML
web-com...
polymer
Redux
2 commits
# 453,321
Dart
HTML
web-com...
polymer
2 commits
# 462,189
JavaScr...
HTML
web-com...
polymer
2 commits
# 241,893
polymer
Google
HTML
CSS
1 commit
# 518,628
JavaScr...
HTML
web-com...
polymer
1 commit
# 525,068
JavaScr...
HTML
web-com...
polymer
1 commit
# 159,363
HTML
Redux
CSS
express...
1 commit
# 78,237
TypeScr...
peerjs
reactjs
React
1 commit
# 104,274
Redux
HTML
web-com...
Go
1 commit
# 138,916
React N...
iOS
mapbox-...
HTML
1 commit
# 309,677
HTML
markers
Angular
web-com...
1 commit
# 213,438
Rust
web-com...
vulkan
tailwin...
1 commit
# 184,975
PHP
Laravel
Shell
HTML
1 commit

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.