Как сохранить старые данные в компоненте РЕАКТ

Question

Ну, я думаю, что это глупый вопрос, но, поверьте мне, я застрял и хочу решить свою проблему. На самом деле, я использовал бесконечный скроллер react-waypoint в своем приложении, и он работал нормально. Я получил данные с сервера через API и передал данные через реквизиты в другой компонент. Он показывает правильно для первых начальных данных, но когда я прокручиваю вниз, и в этом случае я нажимаю API, и он выбирает новые данные, поэтому здесь я обновляю его состояние, мои старые данные были потеряны и новые данные заменены, но здесь я хочу сохранить старые также, когда я прокручиваю вниз, я хочу обновить состояние и пройти через реквизит but I did not want to lose my old data I want old and new data in one list. Может кто-нибудь, пожалуйста, помогите мне, как решить мою проблему. Я поделюсь своим кодом.

Код (индекс. JS)

               <div className="row">
                {properties &&
                  properties.items.map((item, index) => (
                    <PropertyDetail
                      image={item.inventoryImages[0].secureUrl}
                      key={index}
                    />
                  ))}
              </div>

              <Waypoint onEnter={onEnterAddPropModalWaypoint} />

PropertyDetail. js

import React from "react";

const PropertyDetail = ({ image }) => {
  return (
    <>
      <div className="col-md-4 mb-4">
        <img
          src={image}
          alt="newImage"
          style={{ height: "150px", width: "100%" }}
        />
      </div>
    </>
  );
};

export default PropertyDetail;

Answer 1

Я не мог хорошо понять, но если вы пытаетесь сохранить старый массив данных, вы можете использовать

const [properties, setProperties] = useState([]) // don't forget the initial []

// somewhere where you do your api call
setData([...properties, ...response.properties]);

Answer 2

Нужно видеть больше вашего кода; конкретно где вы устанавливаете штат? Но в основном вы вызываете setState или используете ловушку для обновления состояния и сохранения предыдущего состояния.

this.setState({
  properties: [...this.properties, ...newData]
})

или, если вы используете крючки, что-то вроде:

const [properties, setProperties] = useState([]);

this.getMoreData().then(results => {
  this.setProperties([...properties, ...results]);
})