Remove excessive recurrent code from store and computed
Roman Numeral Treatment of Suspensions
How to write papers efficiently when English isn't my first language?
Inappropriate reference requests from Journal reviewers
Term for the "extreme-extension" version of a straw man fallacy?
Does The Brexit Deal Have To Be Agreed By Both Houses?
How did Doctor Strange see the winning outcome in Avengers: Infinity War?
What does "Allow AS in" do in BGP?
Large drywall patch supports
Is there a good way to store credentials outside of a password manager?
Why doesn't table tennis float on the surface? How do we calculate buoyancy here?
when is out of tune ok?
What grammatical function is や performing here?
Do the temporary hit points from the Battlerager barbarian's Reckless Abandon stack if I make multiple attacks on my turn?
Trouble understanding the speech of overseas colleagues
Failed to fetch jessie backports repository
What does "I’d sit this one out, Cap," imply or mean in the context?
Opposite of a diet
What is the opposite of 'gravitas'?
Number of words that can be made using all the letters of the word W, if Os as well as Is are separated is?
Why are there no referendums in the US?
Avoiding estate tax by giving multiple gifts
Why not increase contact surface when reentering the atmosphere?
Is oxalic acid dihydrate considered a primary acid standard in analytical chemistry?
Rotate a column
Remove excessive recurrent code from store and computed
$begingroup$
I have three getters in my store:
getActiveTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'in_progress')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
getFutureTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'promo')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
getPastTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'finished')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
In my component I have a slider which accept an array of three items, each first one from an arrays returned by every getters.
So I created a computed property in my component in order to get these items and then pass them to the slider:
<template>
...
<hovering-image-slider v-if="getLatestTournaments.length > 0"
:slideData="getLatestTournaments" />
...
</template>
<script>
...
getLatestTournaments() {
return this.getFutureTournaments[0]
&& this.getActiveTournaments[0]
&& this.getPastTournaments[0]
? [
this.getFutureTournaments[0],
this.getActiveTournaments[0],
this.getPastTournaments[0]]
: [];
},
</script>
It works fine but it seems like an ugly solution. Slider component will get an error of undefined data if I will not check the presence of [0] element in the computed property. I thought that by doing some checking at the level of my getters, it will not require checking in the component but apparently it does. Can you please advice how I can improve this existing code?
javascript vue.js
asked 2 mins ago
Olga BOlga B
234
$endgroup$
add a comment |
$begingroup$
I have three getters in my store:
getActiveTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'in_progress')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
getFutureTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'promo')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
getPastTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'finished')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
In my component I have a slider which accept an array of three items, each first one from an arrays returned by every getters.
So I created a computed property in my component in order to get these items and then pass them to the slider:
<template>
...
<hovering-image-slider v-if="getLatestTournaments.length > 0"
:slideData="getLatestTournaments" />
...
</template>
<script>
...
getLatestTournaments() {
return this.getFutureTournaments[0]
&& this.getActiveTournaments[0]
&& this.getPastTournaments[0]
? [
this.getFutureTournaments[0],
this.getActiveTournaments[0],
this.getPastTournaments[0]]
: [];
},
</script>
It works fine but it seems like an ugly solution. Slider component will get an error of undefined data if I will not check the presence of [0] element in the computed property. I thought that by doing some checking at the level of my getters, it will not require checking in the component but apparently it does. Can you please advice how I can improve this existing code?
javascript vue.js
asked 2 mins ago
Olga BOlga B
234
$endgroup$
add a comment |
$begingroup$
I have three getters in my store:
getActiveTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'in_progress')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
getFutureTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'promo')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
getPastTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'finished')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
In my component I have a slider which accept an array of three items, each first one from an arrays returned by every getters.
So I created a computed property in my component in order to get these items and then pass them to the slider:
<template>
...
<hovering-image-slider v-if="getLatestTournaments.length > 0"
:slideData="getLatestTournaments" />
...
</template>
<script>
...
getLatestTournaments() {
return this.getFutureTournaments[0]
&& this.getActiveTournaments[0]
&& this.getPastTournaments[0]
? [
this.getFutureTournaments[0],
this.getActiveTournaments[0],
this.getPastTournaments[0]]
: [];
},
</script>
It works fine but it seems like an ugly solution. Slider component will get an error of undefined data if I will not check the presence of [0] element in the computed property. I thought that by doing some checking at the level of my getters, it will not require checking in the component but apparently it does. Can you please advice how I can improve this existing code?
javascript vue.js
asked 2 mins ago
Olga BOlga B
234
$endgroup$
I have three getters in my store:
getActiveTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'in_progress')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
getFutureTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'promo')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
getPastTournaments(state) {
return state.tournaments.data
? state.tournaments.data
.filter(tournament => tournament.state_value === 'finished')
// sort tournaments by date of creation
.sort((tournamentA, tournamentB) => tournamentA.created_at - tournamentB.created_at)
: [];
},
In my component I have a slider which accept an array of three items, each first one from an arrays returned by every getters.
So I created a computed property in my component in order to get these items and then pass them to the slider:
<template>
...
<hovering-image-slider v-if="getLatestTournaments.length > 0"
:slideData="getLatestTournaments" />
...
</template>
<script>
...
getLatestTournaments() {
return this.getFutureTournaments[0]
&& this.getActiveTournaments[0]
&& this.getPastTournaments[0]
? [
this.getFutureTournaments[0],
this.getActiveTournaments[0],
this.getPastTournaments[0]]
: [];
},
</script>
It works fine but it seems like an ugly solution. Slider component will get an error of undefined data if I will not check the presence of [0] element in the computed property. I thought that by doing some checking at the level of my getters, it will not require checking in the component but apparently it does. Can you please advice how I can improve this existing code?
javascript vue.js
javascript vue.js
asked 2 mins ago
Olga BOlga B
234
asked 2 mins ago
Olga BOlga B
234
asked 2 mins ago
Olga BOlga B
234
asked 2 mins ago
Olga BOlga B
234
asked 2 mins ago
Olga BOlga B
234
234
add a comment |
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
return StackExchange.using("mathjaxEditing", function () {
StackExchange.MarkdownEditor.creationCallbacks.add(function (editor, postfix) {
StackExchange.mathjaxEditing.prepareWmdForMathJax(editor, postfix, [["\$", "\$"]]);
});
});
}, "mathjax-editing");
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: "196"
};
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: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
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%2fcodereview.stackexchange.com%2fquestions%2f216401%2fremove-excessive-recurrent-code-from-store-and-computed%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Code Review Stack Exchange!
- 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.
Use MathJax to format equations. MathJax reference.
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%2fcodereview.stackexchange.com%2fquestions%2f216401%2fremove-excessive-recurrent-code-from-store-and-computed%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
