Показать первый элемент computed Vue.js?

Question

[Dauren S]

Почему при попытке показать первый элемент списка из computed, в консоли ошибка
main.js:87126 [Vue warn]: Error in render: "TypeError: Cannot read property '0' of null"
Хотя на странице все отображается.

<div class="col-sm-9">
              <div class="jumbotron">
                   {{itemsList[0]}}
                    <hr class="my-4">
            </div>
        </div>

computed: {
        itemsList() {
            return this.$store.getters.MY_ITEMS;
        },       
    }

store

export const SET_MY_ITEMS = 'SET_MY_ITEMS';

export const myStore = {
    state: {
        my_items: null,
    },
    getters: {
      MY_ITEMS: state => {
        return state.my_items;
      },
    },
    mutations: { // commit
        [SET_MY_ITEMS](state, my_items) {
            state.my_items = my_items;
        },
       
    },
    actions: { // dispatch
      [SET_MY_ITEMS](context) {
        axios.post('/api/index').then((response) => {
            context.commit('SET_MY_ITEMS', response['data']['list']);
        }).catch(error => {
        });
    },
      
    },
   
};

Answer 1

[Alex]

А данные в MY_ITEMS откуда берутся? Если откуда-то загружаются, то скорее всего во время рендеринга их ещё нет. И там null

Comments

[Dauren S]

Добавил данные по состоянию.