Как сделать чтобы данные изменились, которые присутствуют в localStorage?

Question

[Руслан Абсалямов]

Как мне сделать так, чтобы данные которые имеются в localStorage изначально подставлялись, потому что данные заполняются, которые пришли из axios, я вижу в жизненном цикле updated. Соответственно немогу изначально заменить эти значение и вместить ширину колонки туда.
Моя реализация https://codesandbox.io/s/pyvjxxnnvj
Находиться файл /src/views/WidthTable.vue
Я думал сделать что-то типо такого

<td
            v-for="(column, ind) in columns"
            :style="{
              position: 'relative',
              width: startWidth[column.name]
                ? startWidth[column.name] + 'px'
                : column.width + 'px'
            }"
          >

В template
Потом в data создаю пустой объект

created: function() {
    let arr = [
      axios.get("./data/columns.json"),
      axios.get("./data/employee.json")
    ];
    Promise.all(arr).then(res => {
      this.columns = res[0].data;
      this.rows = res[1].data;
      for (let i = 0; i < this.columns.length; i++) {
        let storage = localStorage.getItem(`col-${this.columns[i].name}`);
        if (storage) {
          this.startWidth[this.columns[i].name] = storage;
        }
      }
    });
  }

И в created я риазмещаю туда как раз данные из localStorage. Но такой подход как я понял, что те данные которые нет, они меняют ширину до тех пор, пока не появяться данные в localStorage. Но как правильно сделать?

Answer 1

[grinat]

Плохо понял что надо, но вероятно это:

methods: {
getColWidth (name, defaultValue) {
return localStorage.getItem(`col-${name}`) || defaultValue
}
}

:style="{
position: 'relative',
width: startWidth[column.name]
? startWidth[column.name] + 'px'
: getColWidth(name, column.width) + 'px'
}"