Best practice with global store methods and V6

1

I’m about to migrate a first project to the new V6 structure… As described, global methods / functions are now defined and handled within the new Store object, right? Let’s say I want to define a global API call method there like:

...
  actions: {
    apiCall(paramObj) {
       ...
       [f7Object].request(...
          ...
        success: function (data, status, xhr) {
          return data;
        }...

what is the best practice to access the f7 object and its methods within the store? Sure - I can always pass it as a parameter when I call those methods… but is there a better way? What is the best approach to deal with global methods?

1 Like
2

You don’t need f7 object to access request, you can just import request in store file:

import { request } from 'framework7';

// use request directly below
...
2 Likes
3

wow… that’s it? Just like

image
image790×240 21.4 KB
? Awesome! Thank you!

4

… and how does this work with global custom events in store? Like

app.emit(“apiCall.success”, paramObj, …);

How does this work from here?

5

OK… after some research I endet up to do it like this… I added an events.js with:

import Framework7 from 'framework7';
const events = new Framework7.Events();
export default events;

On top of my store.js I imported it like:

import events from './events.js';

and the event gets triggered like:

events.emit("myEventIdString", optParam, ...);

Everywhere I want to listen to this events, I also imported the events.js like in store.js and implemented it like:

const intProcessingFunction = (optParam, ...) => {
   console.log('here is my Event!', optParam);
}
...
events.on('myEventIdString', intProcessingFunction);

Is this the way to do this? Does it make sense to include events in the app.js already and add it to app object like you do with store?

I work quite a while with FW7 now, but I unfortunately kept the structural html/js things from the early days. Since I switched over to V6 and CLI, I feel a bit like a newbee again :wink:

1 Like