добавление нового объекта в массив объектов в реаги

0

У меня возникает небольшая проблема при попытке добавить новый объект в массив объектов, который хранится в состоянии.

Ниже приведен пример объекта, который хранится в состоянии (scratchTickers):

id : uuid.v1(),
area     : 'Scratch',
name     : 'Untitled',
status   : "",
size     : "",
created  : {
 name : "username",
 time : new Date()
},
modified : {
 name : "username",
 time : new Date()
},
content: [{
 content: "Dummy content",
 TowerRed: "",
 TowerText: "Headlines"
}]

Мне нужно динамически добавлять новые объекты в массив контента, объект структурирован следующим образом:

{
 content: "Dummy content",
 TowerRed: "",
 TowerText: "Headlines"
}

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

вот моя функция добавить новый объект в массив содержимого и обновить состояние:

_createTickerItem: function (id) {
        var tickerID = id;
        var key      = null;

        for (var i = 0; i < this.state.scratchTickers.length; i++) {

            if(this.state.scratchTickers[i].id == tickerID) {
                var ticker = this.state.scratchTickers[i];
                var key    = i;
            }
        }

        var blankContent = ({
                content: "Ticker Content",
                TowerRed: "",
                TowerText: "Headlines"
            });

        var oldContent = this.state.scratchTickers[key];

        var newContent = update(oldContent, {
            content : {
                $push : [blankContent]
            }
        });

        this.setState({
            scratchTickers: newContent
        });

    },

Поэтому, когда я нажимаю кнопку tun, запускаю функцию _createTickerItem компонент повторно отображает и основной объект полностью исчезает.

Редактирование * Хорошо, поэтому я теперь на шаг дальше, чтобы установить 'newContent' в качестве массива во время состояния установки, теперь добавляет новые объекты в массив содержимого и корректно отображает их.

this.setState({
        scratchTickers: [newContent]
    });

Однако, если в состоянии было несколько объектов, это заменит их все на отдельные объекты одним объектом. Итак, как бы это работало, если бы я сказал родительским объектам в состоянии, но хотел просто изменить массив содержимого объекта 1?

Изменить 2: я должен добавить, что scratchTickers - это массив объектов, поэтому цикл for необходим, чтобы убедиться, что я изменяю правильный объект.

  • 0
    Похоже, вы полностью заменяете scratchTickers на newContent . Вы должны установить новый контент в ключе content и переустановить scratchTickers. Имеет смысл?
  • 0
    Я думаю, что только что столкнулся с тем, что вы сказали, пожалуйста, смотрите мое обновление. Сейчас он частично работает, но если было несколько родительских объектов, я теперь заменяю их всех одним обновленным объектом.
Показать ещё 2 комментария
Теги:
object
arrays
immutability

1 ответ

2
Лучший ответ

Вы заменяете весь массив scratchTickers только последним обновленным объектом.

Сначала вам нужно обновить весь массив.

var updates = {};
updates[key] = { $set: newContent }

var newScratchTickers = update(this.state.scratchTickers, updates);

this.setState({
    scratchTickers: newScratchTickers
});
  • 0
    это не работает, так как мне нужен ключевой элемент, чтобы убедиться, что я изменяю правильный объект, поскольку в массиве scratchTickers может быть несколько объектов.
  • 1
    @chinds извините, я неправильно понял ваш пост. Только что отредактировал ответ, посмотрите!
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню