Where i should put dynamic and reactive parameter - in vue computed or vue store?
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' : where '1' is shopID
{name: 'Banana', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}
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
add a comment |
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' : where '1' is shopID
{name: 'Banana', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}
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
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
add a comment |
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' : where '1' is shopID
{name: 'Banana', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}
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
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' : where '1' is shopID
{name: 'Banana', category: 'Fruits', 'sales': 50},
{name: 'Apple', category: 'Fruits', 'sales': 50}
}
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
javascript vue.js vuex
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
add a comment |
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
add a comment |
2 Answers
2
active
oldest
votes
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
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
add a comment |
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.
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
add a comment |
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
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
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
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
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
add a comment |
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
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
add a comment |
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
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
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
add a comment |
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
add a comment |
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.
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
add a comment |
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.
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
add a comment |
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.
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.
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
add a comment |
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
add a comment |
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.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
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
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
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
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