V-for v-bind:class не работает если переменная undifined?

Question

[kiranananda]

Здравствуйте!

Вообщем натолкнулся на такой трабл. Выставляю доп классы в цикле v-for, но если переменная не задана, то-есть, то когда я ее устанавливаю реактивность не работает. Потом уже когда срабатывают другие условия он и класс мой тоже обновляет.
Дело в том что данные беру с пхп, а там обычный запрос к бд и не совсем хотелось там дополнительно добавлять еще и переменные для классов, как то не красиво. Вот не знаю как реализовать грамотно это...
Можно добавить эти переменные перед рендерингом, но в данном случае использую не ajax а props, не нашел нужного хука что бы сделать изменения...

v-bind:class="{ 'selected': file.selected }
            selectFile: function (file) {
                //эта переменная не была установлена. Если установить перед рендерингом то все ок...
                file['selected'] = true;
            },

Answer 1

[0xD34F]

Устанавливайте значение с помощью $set.

Т.е., вместо

file['selected'] = true

сделайте

this.$set(file, 'selected', true)

Comments

[kiranananda]

Спасибо тебе! Думал оно только к корневым )), вот ведь пол дня на таком затыке просидел ))

Answer 2

[Дима Паутов]

Ну если вы используете свойство копонента, то задайте его по умолчанию на нужное внутри компонента.

props: {
myProp: {
type: // тип переменной,
default: false // или другое значение
}
}

Comments

[kiranananda]

У меня массив, он перебирается через v-for. По сути это список файлов и при тычке в который я добавляю свойство selected в массиве. Но как пробежать по этому массиву и задать нужные свойство до рендеринга тоже трабл еще тот :). Там есть хук beforeCreate но там же свойство props еще не доступно ). Кароче вот, нид хелп :)

[Дима Паутов]

что бы делать вещи до рендеринга, есть медод created(), как mounted(), но делает дела до рендеринга компонента

[kiranananda]

Ой извини перепутал, надо до реактивности сделать... Иначе не работает... А там только beforeCreate