Skip to content

Instantly share code, notes, and snippets.

@JaySunSyn

JaySunSyn/todo-list.html

Last active January 17, 2018 17:31
Show Gist options
  • Save JaySunSyn/8f1dba2b265a9f6614f9a4857eaf83e1 to your computer and use it in GitHub Desktop.
Save JaySunSyn/8f1dba2b265a9f6614f9a4857eaf83e1 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. JaySunSyn revised this gist Jan 17, 2018. 1 changed file with 0 additions and 4 deletions.
    4 changes: 0 additions & 4 deletions todo-list.html
    View file
    Original file line number Diff line number Diff line change
    @@ -27,10 +27,6 @@
    };
    }

    connectedCallback() {
    super.connectedCallback();
    }

    _remove(e) {
    this.dispatch(App.actions.remove(e.model.todo));
    }
  2. JaySunSyn created this gist Jan 17, 2018.
    41 changes: 41 additions & 0 deletions todo-list.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,41 @@
    <link rel="import" href="../bower_components/polymer/polymer-element.html">
    <link rel="import" href="../bower_components/polymer/lib/elements/dom-repeat.html">

    <link rel="import" href="redux/redux-mixin.html">

    <dom-module id="todo-list">
    <template>
    <ul>
    <template is="dom-repeat" items="[[todos]]" as="todo">
    <li on-click="_remove">[[todo.text]] <span style="color: white">Remove</span></li>
    </template>
    </ul>
    </template>

    <script>
    class TodoList extends App.ReduxMixin(Polymer.Element) {
    static get is() {
    return 'todo-list';
    }

    static get properties() {
    return {
    todos: {
    type: Array,
    statePath: App.select.todos,
    },
    };
    }

    connectedCallback() {
    super.connectedCallback();
    }

    _remove(e) {
    this.dispatch(App.actions.remove(e.model.todo));
    }
    }

    window.customElements.define(TodoList.is, TodoList);
    </script>
    </dom-module>