Why should I use the action decorator in mobx
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
I'm trying to get my head around the usefulness of the action decorator in mobx, even after reading the doc, https://mobx.js.org/refguide/action.html
Still wondering why I should use @action or @action.bound, other than to enforce a pattern where a component cannot change the observable directly.
The above article mentions providing "useful debugging information". But where can I find this info? F12->Console doesn't show anything when calling an @action or @action.bound method.
Or am I doing something wrong in the below code?
Should I install some mobx debugger? Thanks.
class CommentStore {
@observable commentData = ;
@action.bound
updateComment(id, name) {
this.commentData.map(p => p.id === id ? p.name = name : p.name = p.name);
}
...
mobx
asked Nov 16 '18 at 17:01
Ole EH DufourOle EH Dufour
1,15011122
add a comment |
I'm trying to get my head around the usefulness of the action decorator in mobx, even after reading the doc, https://mobx.js.org/refguide/action.html
Still wondering why I should use @action or @action.bound, other than to enforce a pattern where a component cannot change the observable directly.
The above article mentions providing "useful debugging information". But where can I find this info? F12->Console doesn't show anything when calling an @action or @action.bound method.
Or am I doing something wrong in the below code?
Should I install some mobx debugger? Thanks.
class CommentStore {
@observable commentData = ;
@action.bound
updateComment(id, name) {
this.commentData.map(p => p.id === id ? p.name = name : p.name = p.name);
}
...
mobx
asked Nov 16 '18 at 17:01
Ole EH DufourOle EH Dufour
1,15011122
add a comment |
I'm trying to get my head around the usefulness of the action decorator in mobx, even after reading the doc, https://mobx.js.org/refguide/action.html
Still wondering why I should use @action or @action.bound, other than to enforce a pattern where a component cannot change the observable directly.
The above article mentions providing "useful debugging information". But where can I find this info? F12->Console doesn't show anything when calling an @action or @action.bound method.
Or am I doing something wrong in the below code?
Should I install some mobx debugger? Thanks.
class CommentStore {
@observable commentData = ;
@action.bound
updateComment(id, name) {
this.commentData.map(p => p.id === id ? p.name = name : p.name = p.name);
}
...
mobx
asked Nov 16 '18 at 17:01
Ole EH DufourOle EH Dufour
1,15011122
I'm trying to get my head around the usefulness of the action decorator in mobx, even after reading the doc, https://mobx.js.org/refguide/action.html
Still wondering why I should use @action or @action.bound, other than to enforce a pattern where a component cannot change the observable directly.
The above article mentions providing "useful debugging information". But where can I find this info? F12->Console doesn't show anything when calling an @action or @action.bound method.
Or am I doing something wrong in the below code?
Should I install some mobx debugger? Thanks.
class CommentStore {
@observable commentData = ;
@action.bound
updateComment(id, name) {
this.commentData.map(p => p.id === id ? p.name = name : p.name = p.name);
}
...
mobx
mobx
asked Nov 16 '18 at 17:01
Ole EH DufourOle EH Dufour
1,15011122
asked Nov 16 '18 at 17:01
Ole EH DufourOle EH Dufour
1,15011122
asked Nov 16 '18 at 17:01
Ole EH DufourOle EH Dufour
1,15011122
asked Nov 16 '18 at 17:01
Ole EH DufourOle EH Dufour
1,15011122
asked Nov 16 '18 at 17:01
Ole EH DufourOle EH Dufour
1,15011122
1,15011122
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
If you mutate more than an observable variables inside a method which is not decorated by @action, your derivations (autorun) will run multiple time. This issue is not present when you work with react. render function will run only once.
one of the things which @action decorator do is to prevent multiple invocation of your derivations.
answered Nov 17 '18 at 13:50
Ehssan MajdabadiEhssan Majdabadi
418514
Hi Ehssan, what is a derivation? A computed value? I don't use autorun..
– Ole EH Dufour
Nov 17 '18 at 14:01
And in the above example did I make use of it properly? Is it @ action or @ action.bound, don't see the difference
– Ole EH Dufour
Nov 17 '18 at 14:03
Derivations stands for computed values and reactions. As I said if you use the observable values only in react render method there is no need to use @action.
– Ehssan Majdabadi
Nov 17 '18 at 15:54
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%2f53342344%2fwhy-should-i-use-the-action-decorator-in-mobx%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
If you mutate more than an observable variables inside a method which is not decorated by @action, your derivations (autorun) will run multiple time. This issue is not present when you work with react. render function will run only once.
one of the things which @action decorator do is to prevent multiple invocation of your derivations.
answered Nov 17 '18 at 13:50
Ehssan MajdabadiEhssan Majdabadi
418514
Hi Ehssan, what is a derivation? A computed value? I don't use autorun..
– Ole EH Dufour
Nov 17 '18 at 14:01
And in the above example did I make use of it properly? Is it @ action or @ action.bound, don't see the difference
– Ole EH Dufour
Nov 17 '18 at 14:03
Derivations stands for computed values and reactions. As I said if you use the observable values only in react render method there is no need to use @action.
– Ehssan Majdabadi
Nov 17 '18 at 15:54
add a comment |
If you mutate more than an observable variables inside a method which is not decorated by @action, your derivations (autorun) will run multiple time. This issue is not present when you work with react. render function will run only once.
one of the things which @action decorator do is to prevent multiple invocation of your derivations.
answered Nov 17 '18 at 13:50
Ehssan MajdabadiEhssan Majdabadi
418514
Hi Ehssan, what is a derivation? A computed value? I don't use autorun..
– Ole EH Dufour
Nov 17 '18 at 14:01
And in the above example did I make use of it properly? Is it @ action or @ action.bound, don't see the difference
– Ole EH Dufour
Nov 17 '18 at 14:03
Derivations stands for computed values and reactions. As I said if you use the observable values only in react render method there is no need to use @action.
– Ehssan Majdabadi
Nov 17 '18 at 15:54
add a comment |
If you mutate more than an observable variables inside a method which is not decorated by @action, your derivations (autorun) will run multiple time. This issue is not present when you work with react. render function will run only once.
one of the things which @action decorator do is to prevent multiple invocation of your derivations.
answered Nov 17 '18 at 13:50
Ehssan MajdabadiEhssan Majdabadi
418514
If you mutate more than an observable variables inside a method which is not decorated by @action, your derivations (autorun) will run multiple time. This issue is not present when you work with react. render function will run only once.
one of the things which @action decorator do is to prevent multiple invocation of your derivations.
answered Nov 17 '18 at 13:50
Ehssan MajdabadiEhssan Majdabadi
418514
edited Nov 17 '18 at 13:58
answered Nov 17 '18 at 13:50
Ehssan MajdabadiEhssan Majdabadi
418514
answered Nov 17 '18 at 13:50
Ehssan MajdabadiEhssan Majdabadi
418514
answered Nov 17 '18 at 13:50
Ehssan MajdabadiEhssan Majdabadi
418514
418514
Hi Ehssan, what is a derivation? A computed value? I don't use autorun..
– Ole EH Dufour
Nov 17 '18 at 14:01
And in the above example did I make use of it properly? Is it @ action or @ action.bound, don't see the difference
– Ole EH Dufour
Nov 17 '18 at 14:03
Derivations stands for computed values and reactions. As I said if you use the observable values only in react render method there is no need to use @action.
– Ehssan Majdabadi
Nov 17 '18 at 15:54
add a comment |
Hi Ehssan, what is a derivation? A computed value? I don't use autorun..
– Ole EH Dufour
Nov 17 '18 at 14:01
And in the above example did I make use of it properly? Is it @ action or @ action.bound, don't see the difference
– Ole EH Dufour
Nov 17 '18 at 14:03
Derivations stands for computed values and reactions. As I said if you use the observable values only in react render method there is no need to use @action.
– Ehssan Majdabadi
Nov 17 '18 at 15:54
Hi Ehssan, what is a derivation? A computed value? I don't use autorun..
– Ole EH Dufour
Nov 17 '18 at 14:01
Hi Ehssan, what is a derivation? A computed value? I don't use autorun..
– Ole EH Dufour
Nov 17 '18 at 14:01
And in the above example did I make use of it properly? Is it @ action or @ action.bound, don't see the difference
– Ole EH Dufour
Nov 17 '18 at 14:03
And in the above example did I make use of it properly? Is it @ action or @ action.bound, don't see the difference
– Ole EH Dufour
Nov 17 '18 at 14:03
Derivations stands for computed values and reactions. As I said if you use the observable values only in react render method there is no need to use @action.
– Ehssan Majdabadi
Nov 17 '18 at 15:54
Derivations stands for computed values and reactions. As I said if you use the observable values only in react render method there is no need to use @action.
– Ehssan Majdabadi
Nov 17 '18 at 15:54
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%2f53342344%2fwhy-should-i-use-the-action-decorator-in-mobx%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
