webcomponents-reactway-10.js

import { toggle, remove, replace } from '../libs/actions';
...
class TodoItem extends LitRender(HTMLElement) {
...
  connectedCallback() {
    const root = this.shadowRoot;
...
    root.addEventListener('click', handlers.onClick);
...
  }
  disconnectedCallback() {
    const root = this.shadowRoot;
...
    root.removeEventListener('click', this._handlers.onClick);
...
  }
...
  _onClick(event) {
    const id = this.todo.id;
    const classList = event.path[0].classList;
    if (classList.contains('toggle')) {
      toggle(id);
    } else if (classList.contains('destroy')) {
      remove(id);
    }
  }
...