Как установить состояние компонента условно

Question

Это мой основной компонент приложения, который работает, но только при наличии данных localStorage.

Я изо всех сил пытаюсь найти способ установить состояние в пустой массив, если localStorage пуст. Любая помощь о том, как это сделать, будет действительно оценена! Я пробовал несколько различных условных выражений, но, похоже, ни один из них не работает.

export default class App extends Component {
  constructor(props){
    super(props);
    // set variable as data from local storage
    const storageData = JSON.parse(localStorage.getItem('listItems'));
    console.log(storageData);

    // set initial state
      this.state = {
        value: '',
        url: '',
        // set items array as storage data variable
        // bug: Page only loads if localstorage available
        items: storageData
      }
    this.removeItem = this.removeItem.bind(this);
  }

Answer 1

localStorage.getItem('listItems') вернет null, если listItems еще не существует в localStorage, так что вы можете проверить это перед анализом JSON.

const storageData = localStorage.getItem('listItems');
const parsedStorageData = storageData ? JSON.parse(storageData) : [];

this.state = {
  value: '',
  url: '',
  items: parsedStorageData
}

Answer 2

Простое условие должно работать просто отлично.

  this.state = {
    value: '',
    url: '',
    // If storage is not null or undefined use it,
    // otherwise use an empty array
    items: storageData || []
  }