Monx + Moon.Router

[ksanderer]

Can you provide an example how to work with router and Monx?

require("./components/c1");
require("./components/c2");

Moon.use(Monx);
Moon.use(MoonRouter);

const store = new Monx({
  state: {
    count: 1
  },
  actions: {
    increment: (state, payload) => {
      state.count += payload;
    }
  }
});

const router = new MoonRouter({
    default: "/",
    map: {
        "/": "c1",
        "/:slug": "c2",
    }
});

var app = new Moon({
    router: router,
    el: "#app",
    store: store
});


/*
/components/c2.js
---------------------------------------
How can I use monx in child component?
*/
Moon.component("c2", {
    props: ['route'],

    data: function () {
        return {
            test: "test"
        }
    },

    template: `<div><a on-click='action.increment()'>{{ test }}</a></div>`,
});

[giorgionetg]

Hi.. Watching the architecture of these projects, probably you have to make the same issue on MoonRouter...

[kbrsh]

Just use Monx as you normally would with a component — provide the store option.

Moon.component("c2", {
    props: ['route'],

    data: function () {
        return {
            test: "test"
        }
    },

    template: `<div><a on-click='action.increment()'>{{ test }}</a></div>`,

    store: store // This option must be provided to every component using the store
});