Skip to content
Natalia Djohari edited this page Mar 18, 2019 · 5 revisions

Note! Data saved into the storage module is not saved to disk. Any information you add to the storage after the app has started will be lost when you close the browser window.

Initialising the watch with data on startup

  1. Open client/src/js/storage.js, there is a hello world example in there already

  2. To add more data on startup, add any of the following in client/src/js/storage.js:

        StorageHub.setData('myData', 'hello')
        StorageHub.setData('myData', [1, 2, 3])
        StorageHub.setData('myData', { property: [1, 2, 3] })
    
  3. You can also load data from a json file:

        const addressData = require('./data/address.json');
        StorageHub.setData('address', addressData);
    
  4. You can setData in any page or event.

  5. Access the data in a page of your choice. There is an example in homePage.js and contactsPage.js already.

        const StorageHub = require('watch-framework').StorageHub;
    
        ...
    
        StorageHub.getData('myData')
    
  6. To debug the StorageHub, you can do the following:

        StorageHub.setDebug(true)
        StorageHub.setData('myData', 'is stored!')
        StorageHub.setDebug(false)
    

    This will end up printing the following:

  7. For arrays, there's a find functionality to retrieve all the objects in the list that return true from a callback function. Usage:

        Storage.setData('names', ['Nick', 'Joe', 'Kevin']);
        Storage.find('names', () => true); // ['Nick', 'Joe', 'Kevin']
        Storage.find('names', () => false); // []
        Storage.find('names', name => name.toLowerCase().includes('n')); // ['Nick', 'Kevin']
        Storage.find('names', name => name.length === 3); // ['Joe']
    
        Storage.setData('contacts', [
            {
                'name': 'Allen'
            },
            {
                'name': 'Belle',
                'phone': 123123123
            },
            {
                'phone': 234234234
            }
        ]);
        Storage.find('contacts', contact => contact.hasOwnProperty("name") ); // [{'name': 'Allen'}, {'name': 'Belle', 'phone': 123123123}]
        Storage.find('names', contact => contact.name && contact.name === 'Allen'); // [{'name': 'Allen'}]
        Storage.find('names', name => !contact.name); // [{'phone': 234234234}]