Внешний js-файл Lit-Elements в качестве хранилища изменен привязкой данных свойства - PullRequest
0 голосов
/ 22 ноября 2018

Я пытаюсь использовать в lit-elements внешний js-файл для значений инициализации, но если я это сделаю, он больше не изменится через привязку свойства.если я напишу это без внешнего файла хранения, просто используйте это.сфера и объявить его в конструкторе, все отлично работает.Но как внешний файл не ...?: /

но почему?

у меня есть два файла menu.js:

import { LitElement, html } from '@polymer/lit-element';
import '@polymer/iron-pages/iron-pages.js';
import './main.js'
import { store } from './store'

class MenuElement extends LitElement {

  constructor() {
    super()
    this.page = 0;
    this.ninjas = ['Ninja1', 'Ninja2', 'Ninja3']
    this.log()
  }
  static get properties() {
    return {
      page: {
        type: Number
      },
      header: String,
      ninjas: Array,
      store: {
        type: Object,
        page: {
          type: Number
        }
      }
    }
  }

  render() {
    return html`
      <style>
        /* :host {
          border: solid 10px blue;
        } */
        ::slotted(h3) {
          border: solid 1px red
        }
      </style>
      <div>
        <ul>
          <li @click="${ (e) => { this.changePage2(e) } }">Home</li>
          <li @click="${ (e) => { this.changePage(e) } }">Page</li>
        </ul>
        <ul>
          ${this.ninjas.map(i => html`<li>${i}</li>`)}
        </ul>
      </div>

      <iron-pages selected="${ store.page }">
        <slot name="lala"></slot>
        <div><slot name="testSlot"></slot> Page 0</div>
        <main-view></main-view>
      </iron-pages>

    `;
  }

  changePage() {
    store.page = 1;
    console.log(store.page)
  }
  changePage2() {
    store.page = 0;
    console.log(store.page)
  }
  log() {
    console.log(store)
    console.log(store.page)
  }
}
customElements.define('app-menu', MenuElement);

и b store.js

export let store = {
  page: 1
}

спасибо за любые идеи =)

...