Реагирует ли элемент сетки с данными (массивом) с Firebase? - PullRequest
0 голосов
/ 23 января 2019

Относительно response-grid-layout Demo 8 - Отзывчиво с LocalStorage

Является ли элемент реагирующей сетки принимать данные (массив), извлеченные из Firebase?

Поскольку кажется, что макеты (хранящиеся в локальном хранилище) для извлеченных данных (из Firebase) сбрасываются каждый раз, когда я перезагружаю . Это означает, что при каждой перезагрузке позиции этих данных располагаются в верхнем левом углу.

2-й дел:

Однако, жестко закодированный 2-й div не теряет свои макеты в локальном хранилище . Положение 2-й записки div остается после перезагрузки. Вот почему мне интересно, поддерживает ли react-grid-item выборку данных из Firebase (или другой онлайн-базы данных).

1-й дел:

Я пытался axios и fetch() получить данные (массив) из Firebase через Redux (this.props.addedMemos - это массив из хранилища Redux). Данные из Firebase извлекаются успешно. Если я не перезагружаю страницу и не изменяю размеры элементов сетки, макеты успешно меняются в локальном хранилище. Функции локального хранилища saveToLS и getFromLS тоже работают нормально.

Ниже приведен компонент моего класса (Memos.js) приложения memo:

...
...
...
render(){
 return (
  <div>
    <ResponsiveReactGridLayout
        className="layout"
        breakpoints={{lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0}}
        cols={{ lg: 12, md: 10, sm: 6, xs: 4, xxs: 1 }}
        rowHeight={40}
        layouts={this.state.layouts}
        onLayoutChange={(layout, layouts) =>
            this.onLayoutChange(layout, layouts)
         }>
        {this.props.addedMemos.map(memo => (
            {/* 1st div */}
            <div key={memo.id}>
                <div onClick={() => this.memoClicked(memo)}>
                     <h3>{memo.title}</h3>
                     <hr />
                     <div>{memo.content}</div>
                </div>
            </div>

            {/* 2nd div */}
            <div key="1">
                <div>
                    <h3>Title</h3>
                    <hr />
                    <div>Content</div>
                </div>
            </div>
                ))}
    </ResponsiveReactGridLayout>
 </div>
 );
}

Я ожидаю, что памятка извлеченных данных останется той же позиции после перезагрузки страницы. Однако эти записки сбрасывают свои сохраненные позиции в локальном хранилище после каждой перезагрузки.

Спасибо за ваше время ~

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...