Conditional data init in component page

Hello

why I can’t set data with condition on data in component page :slight_smile:

data: function() {
  return {
    demo : [ 'a', 'b', 'c', 'd' ],
    list: window.localStorage.getItem('myList') || this.demo
  }
}

Guillaume

Это же рекурсия получается

Before, you should store data in localStorage in this way:
localStorage.setItem('myList', JSON.stringify(SOMEDATA));
And after read and may assign to variable:
let varName = JSON.parse(localStorage.getItem('myList');

In your case value of demo you may try to take out of export default{} in this way:

let demoValues = [ 'a', 'b', 'c', 'd' ];
export default {
   ...
   data: function() {
      return {
         demo: demoValues,
         list: JSON.parse(localStorage.getItem('myList') || demoValues
      }
   }
}

то же рекурсия получается

This is how JS works. Object you are referencing this.demo is not yet created so it won’t work.

So just:

data: function() {
  var demo =  [ 'a', 'b', 'c', 'd' ];
  return {
    demo : demo,
    list: window.localStorage.getItem('myList') || demo
  }
}

Назначение на demo и использование внутри data оптимальнее получается.
guillaumebiton учти что в localStorage можно хранить только в виде строк. Чтобы не было ошибок при чтении, нужно все типы объектов конвертировать в строку и также обратно их парсить.