Where i should put dynamic and reactive parameter - in vue computed or vue store?












1















DISCLAIMER



I have vuex store, that store some data. For example -> shops and topCategories

In topCategories i have dict with top products in a shop like this



{ '1' :
{name: 'Banana', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}
where '1' is shopID



And for each shop we have the same topProducts dict structure.



I have a component that display topProducts for selected shop and component should display top products without duplicates. He should sum up if names of products equal.



QUESTION

Where i should put this logic? In 'computed' in view component or in vuex store action?










share|improve this question

























  • He should sum up if names of products equal do you mean that in your store you have sometimes entries like {'1': {name:'Apple', ...}, {name:'Apple', ...}}?

    – Billal Begueradj
    Nov 15 '18 at 8:54











  • @BillalBegueradj yes!

    – Danny Belchenko
    Nov 15 '18 at 9:03
















1















DISCLAIMER



I have vuex store, that store some data. For example -> shops and topCategories

In topCategories i have dict with top products in a shop like this



{ '1' :
{name: 'Banana', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}
where '1' is shopID



And for each shop we have the same topProducts dict structure.



I have a component that display topProducts for selected shop and component should display top products without duplicates. He should sum up if names of products equal.



QUESTION

Where i should put this logic? In 'computed' in view component or in vuex store action?










share|improve this question

























  • He should sum up if names of products equal do you mean that in your store you have sometimes entries like {'1': {name:'Apple', ...}, {name:'Apple', ...}}?

    – Billal Begueradj
    Nov 15 '18 at 8:54











  • @BillalBegueradj yes!

    – Danny Belchenko
    Nov 15 '18 at 9:03














1












1








1








DISCLAIMER



I have vuex store, that store some data. For example -> shops and topCategories

In topCategories i have dict with top products in a shop like this



{ '1' :
{name: 'Banana', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}
where '1' is shopID



And for each shop we have the same topProducts dict structure.



I have a component that display topProducts for selected shop and component should display top products without duplicates. He should sum up if names of products equal.



QUESTION

Where i should put this logic? In 'computed' in view component or in vuex store action?










share|improve this question
















DISCLAIMER



I have vuex store, that store some data. For example -> shops and topCategories

In topCategories i have dict with top products in a shop like this



{ '1' :
{name: 'Banana', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}
where '1' is shopID



And for each shop we have the same topProducts dict structure.



I have a component that display topProducts for selected shop and component should display top products without duplicates. He should sum up if names of products equal.



QUESTION

Where i should put this logic? In 'computed' in view component or in vuex store action?







javascript vue.js vuex






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 15 '18 at 9:14









Billal Begueradj

5,958132843




5,958132843










asked Nov 15 '18 at 8:39









Danny BelchenkoDanny Belchenko

84




84













  • He should sum up if names of products equal do you mean that in your store you have sometimes entries like {'1': {name:'Apple', ...}, {name:'Apple', ...}}?

    – Billal Begueradj
    Nov 15 '18 at 8:54











  • @BillalBegueradj yes!

    – Danny Belchenko
    Nov 15 '18 at 9:03



















  • He should sum up if names of products equal do you mean that in your store you have sometimes entries like {'1': {name:'Apple', ...}, {name:'Apple', ...}}?

    – Billal Begueradj
    Nov 15 '18 at 8:54











  • @BillalBegueradj yes!

    – Danny Belchenko
    Nov 15 '18 at 9:03

















He should sum up if names of products equal do you mean that in your store you have sometimes entries like {'1': {name:'Apple', ...}, {name:'Apple', ...}}?

– Billal Begueradj
Nov 15 '18 at 8:54





He should sum up if names of products equal do you mean that in your store you have sometimes entries like {'1': {name:'Apple', ...}, {name:'Apple', ...}}?

– Billal Begueradj
Nov 15 '18 at 8:54













@BillalBegueradj yes!

– Danny Belchenko
Nov 15 '18 at 9:03





@BillalBegueradj yes!

– Danny Belchenko
Nov 15 '18 at 9:03












2 Answers
2






active

oldest

votes


















0














You will need to store the data in vuex and then access the getters in the computed method:



computed: {
...mapGetters(['topProducts'])
}


In your getters:



topProducts: state => state.topProducts


To sum up, you'll need an action that will commit the mutation. Or even you can use the getters. Here's an example:



computed: {
...mapGetters([
'summingA',
'summingB'
]),
getTotal() {
return this.summingA + this.summingB
}
}


In your getters:



summingA: state => state.summingA,
summingB: state => state.summingB





share|improve this answer


























  • I know it. I asked about sum up logic

    – Danny Belchenko
    Nov 15 '18 at 8:45











  • Updated my answer. Hope, this helps now.

    – Bhojendra Rauniyar
    Nov 15 '18 at 8:50





















0














In my humble opinion you should re-think a little bit more about how you designed this aspect so far. I mean you should not be in a scenario where your store contains duplicate data like this:



{ '1' : 
{name: 'Apple', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}


By principle the store serves as the single source of truth which makes it straightforward to locate a specific piece of state. This implicitly means it is not a good design to have duplicate entries within the store's state. You should store the data before saving it into the store. Complying to this design principle would prevent you from dealing with questions like that one.






share|improve this answer
























  • Looks like i ask my question very bad. I have those dicts for all shops by id and when i select shop 1 and shop 2 view component should display those dicts without duplicates and summed if it have equal names

    – Danny Belchenko
    Nov 15 '18 at 9:23











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














draft saved

draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53315324%2fwhere-i-should-put-dynamic-and-reactive-parameter-in-vue-computed-or-vue-store%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown

























2 Answers
2






active

oldest

votes








2 Answers
2






active

oldest

votes









active

oldest

votes






active

oldest

votes









0














You will need to store the data in vuex and then access the getters in the computed method:



computed: {
...mapGetters(['topProducts'])
}


In your getters:



topProducts: state => state.topProducts


To sum up, you'll need an action that will commit the mutation. Or even you can use the getters. Here's an example:



computed: {
...mapGetters([
'summingA',
'summingB'
]),
getTotal() {
return this.summingA + this.summingB
}
}


In your getters:



summingA: state => state.summingA,
summingB: state => state.summingB





share|improve this answer


























  • I know it. I asked about sum up logic

    – Danny Belchenko
    Nov 15 '18 at 8:45











  • Updated my answer. Hope, this helps now.

    – Bhojendra Rauniyar
    Nov 15 '18 at 8:50


















0














You will need to store the data in vuex and then access the getters in the computed method:



computed: {
...mapGetters(['topProducts'])
}


In your getters:



topProducts: state => state.topProducts


To sum up, you'll need an action that will commit the mutation. Or even you can use the getters. Here's an example:



computed: {
...mapGetters([
'summingA',
'summingB'
]),
getTotal() {
return this.summingA + this.summingB
}
}


In your getters:



summingA: state => state.summingA,
summingB: state => state.summingB





share|improve this answer


























  • I know it. I asked about sum up logic

    – Danny Belchenko
    Nov 15 '18 at 8:45











  • Updated my answer. Hope, this helps now.

    – Bhojendra Rauniyar
    Nov 15 '18 at 8:50
















0












0








0







You will need to store the data in vuex and then access the getters in the computed method:



computed: {
...mapGetters(['topProducts'])
}


In your getters:



topProducts: state => state.topProducts


To sum up, you'll need an action that will commit the mutation. Or even you can use the getters. Here's an example:



computed: {
...mapGetters([
'summingA',
'summingB'
]),
getTotal() {
return this.summingA + this.summingB
}
}


In your getters:



summingA: state => state.summingA,
summingB: state => state.summingB





share|improve this answer















You will need to store the data in vuex and then access the getters in the computed method:



computed: {
...mapGetters(['topProducts'])
}


In your getters:



topProducts: state => state.topProducts


To sum up, you'll need an action that will commit the mutation. Or even you can use the getters. Here's an example:



computed: {
...mapGetters([
'summingA',
'summingB'
]),
getTotal() {
return this.summingA + this.summingB
}
}


In your getters:



summingA: state => state.summingA,
summingB: state => state.summingB






share|improve this answer














share|improve this answer



share|improve this answer








edited Nov 15 '18 at 8:52

























answered Nov 15 '18 at 8:44









Bhojendra RauniyarBhojendra Rauniyar

51.7k2079128




51.7k2079128













  • I know it. I asked about sum up logic

    – Danny Belchenko
    Nov 15 '18 at 8:45











  • Updated my answer. Hope, this helps now.

    – Bhojendra Rauniyar
    Nov 15 '18 at 8:50





















  • I know it. I asked about sum up logic

    – Danny Belchenko
    Nov 15 '18 at 8:45











  • Updated my answer. Hope, this helps now.

    – Bhojendra Rauniyar
    Nov 15 '18 at 8:50



















I know it. I asked about sum up logic

– Danny Belchenko
Nov 15 '18 at 8:45





I know it. I asked about sum up logic

– Danny Belchenko
Nov 15 '18 at 8:45













Updated my answer. Hope, this helps now.

– Bhojendra Rauniyar
Nov 15 '18 at 8:50







Updated my answer. Hope, this helps now.

– Bhojendra Rauniyar
Nov 15 '18 at 8:50















0














In my humble opinion you should re-think a little bit more about how you designed this aspect so far. I mean you should not be in a scenario where your store contains duplicate data like this:



{ '1' : 
{name: 'Apple', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}


By principle the store serves as the single source of truth which makes it straightforward to locate a specific piece of state. This implicitly means it is not a good design to have duplicate entries within the store's state. You should store the data before saving it into the store. Complying to this design principle would prevent you from dealing with questions like that one.






share|improve this answer
























  • Looks like i ask my question very bad. I have those dicts for all shops by id and when i select shop 1 and shop 2 view component should display those dicts without duplicates and summed if it have equal names

    – Danny Belchenko
    Nov 15 '18 at 9:23
















0














In my humble opinion you should re-think a little bit more about how you designed this aspect so far. I mean you should not be in a scenario where your store contains duplicate data like this:



{ '1' : 
{name: 'Apple', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}


By principle the store serves as the single source of truth which makes it straightforward to locate a specific piece of state. This implicitly means it is not a good design to have duplicate entries within the store's state. You should store the data before saving it into the store. Complying to this design principle would prevent you from dealing with questions like that one.






share|improve this answer
























  • Looks like i ask my question very bad. I have those dicts for all shops by id and when i select shop 1 and shop 2 view component should display those dicts without duplicates and summed if it have equal names

    – Danny Belchenko
    Nov 15 '18 at 9:23














0












0








0







In my humble opinion you should re-think a little bit more about how you designed this aspect so far. I mean you should not be in a scenario where your store contains duplicate data like this:



{ '1' : 
{name: 'Apple', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}


By principle the store serves as the single source of truth which makes it straightforward to locate a specific piece of state. This implicitly means it is not a good design to have duplicate entries within the store's state. You should store the data before saving it into the store. Complying to this design principle would prevent you from dealing with questions like that one.






share|improve this answer













In my humble opinion you should re-think a little bit more about how you designed this aspect so far. I mean you should not be in a scenario where your store contains duplicate data like this:



{ '1' : 
{name: 'Apple', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}


By principle the store serves as the single source of truth which makes it straightforward to locate a specific piece of state. This implicitly means it is not a good design to have duplicate entries within the store's state. You should store the data before saving it into the store. Complying to this design principle would prevent you from dealing with questions like that one.







share|improve this answer












share|improve this answer



share|improve this answer










answered Nov 15 '18 at 9:13









Billal BegueradjBillal Begueradj

5,958132843




5,958132843













  • Looks like i ask my question very bad. I have those dicts for all shops by id and when i select shop 1 and shop 2 view component should display those dicts without duplicates and summed if it have equal names

    – Danny Belchenko
    Nov 15 '18 at 9:23



















  • Looks like i ask my question very bad. I have those dicts for all shops by id and when i select shop 1 and shop 2 view component should display those dicts without duplicates and summed if it have equal names

    – Danny Belchenko
    Nov 15 '18 at 9:23

















Looks like i ask my question very bad. I have those dicts for all shops by id and when i select shop 1 and shop 2 view component should display those dicts without duplicates and summed if it have equal names

– Danny Belchenko
Nov 15 '18 at 9:23





Looks like i ask my question very bad. I have those dicts for all shops by id and when i select shop 1 and shop 2 view component should display those dicts without duplicates and summed if it have equal names

– Danny Belchenko
Nov 15 '18 at 9:23


















draft saved

draft discarded




















































Thanks for contributing an answer to Stack Overflow!


  • Please be sure to answer the question. Provide details and share your research!

But avoid



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.




draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53315324%2fwhere-i-should-put-dynamic-and-reactive-parameter-in-vue-computed-or-vue-store%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







Popular posts from this blog

List item for chat from Array inside array React Native

Thiostrepton

Caerphilly