Реагирует ли элемент сетки с данными (массивом) с Firebase?
Относительно реактивно-сеточного макета Демонстрация 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>
);
}
Я ожидаю, что памятка извлеченных данных останется той же позиции после перезагрузки страницы. Однако эти заметки сбрасывают свои сохраненные позиции в локальном хранилище после каждой перезагрузки.
Спасибо за ваше время ~