Displaying a list of notes

I will start by displaying a list of notes because the other features depend on it. Another possible feature to start with is the ability to create a new note.

In order to display a list of notes, we need to add that list to the application's Vuex.Store. Then we need a Vue component that uses the store to display the notes.

The first test is about defining a note list inside the application's main store:

// test/store/store.spec.jsimport store from '../../src/store';describe('EveryNote main store', () => {  it('should have a list of notes', () => {    expect(Array.isArray(store.state.noteList)).toBe(true);  });});

Next, define the implementation:

// src/store/index.jsimport ...// ...const store = new Vuex.Store({ state: ...

Get Vuex Quick Start Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.