ReactJs in CEFSharp save state and restore at startup
I am currently writing a ReactJS UI for my c# Project. It will run in a CEFSharp control.
Now I try to save the state of a Reacj object whenever the state is changed.
When the c# programm is (re-)started the saved state should be restored in the page.
What is working so far:
Transmitting the state and saving it in c# is working:
exportState(){
if(navigator.userAgent === 'CEF')
{
let jsonstate = JSON.stringify(this.state.Fenster);
window.nativeHost.kontrolstate(jsonstate);
}
}
Fenster is an array of an own defined object.
To be able to push the saved state back to the react component I have created an ref:
<Kontrolle ref={(kont) => {window.Kontrolle = kont}} />
So I can call the procedures of component Kontrolle via a javascript call in CEFSharp.
To restore the state I call this procedure:
jsontostate(jsonstring){
var fen = jsonstring;
let fenster = this.state.Fenster;
for (var i=0; i<fen.length;i++) {
var f = fen[i];
let index = fenster.findIndex(x => x.id === f.id);
fenster[index].colum = f.colum;
fenster[index].offen = f.offen;
fenster[index].sort = f.sort;
}
this.setState({Fenster: fenster});
this.render();
}
It looks like working perfecly.
The state is updated correctly.
Also when I check the state in the debug console of CEFSharp it looks correctly.
There is also no error displayed in the console.
What is not working:
The state has influence to the page.
After calling the procedure the page is not rendered newly.
So the state and page are not in line.
I already have tried to force a render.
Without success.
Where is my mistake?
Can someone give me a hint?
reactjs cefsharp
edited Nov 18 '18 at 0:14
David
2,12122028
asked Nov 17 '18 at 23:17
Jürgen SchneideratJürgen Schneiderat
1
add a comment |
I am currently writing a ReactJS UI for my c# Project. It will run in a CEFSharp control.
Now I try to save the state of a Reacj object whenever the state is changed.
When the c# programm is (re-)started the saved state should be restored in the page.
What is working so far:
Transmitting the state and saving it in c# is working:
exportState(){
if(navigator.userAgent === 'CEF')
{
let jsonstate = JSON.stringify(this.state.Fenster);
window.nativeHost.kontrolstate(jsonstate);
}
}
Fenster is an array of an own defined object.
To be able to push the saved state back to the react component I have created an ref:
<Kontrolle ref={(kont) => {window.Kontrolle = kont}} />
So I can call the procedures of component Kontrolle via a javascript call in CEFSharp.
To restore the state I call this procedure:
jsontostate(jsonstring){
var fen = jsonstring;
let fenster = this.state.Fenster;
for (var i=0; i<fen.length;i++) {
var f = fen[i];
let index = fenster.findIndex(x => x.id === f.id);
fenster[index].colum = f.colum;
fenster[index].offen = f.offen;
fenster[index].sort = f.sort;
}
this.setState({Fenster: fenster});
this.render();
}
It looks like working perfecly.
The state is updated correctly.
Also when I check the state in the debug console of CEFSharp it looks correctly.
There is also no error displayed in the console.
What is not working:
The state has influence to the page.
After calling the procedure the page is not rendered newly.
So the state and page are not in line.
I already have tried to force a render.
Without success.
Where is my mistake?
Can someone give me a hint?
reactjs cefsharp
edited Nov 18 '18 at 0:14
David
2,12122028
asked Nov 17 '18 at 23:17
Jürgen SchneideratJürgen Schneiderat
1
add a comment |
I am currently writing a ReactJS UI for my c# Project. It will run in a CEFSharp control.
Now I try to save the state of a Reacj object whenever the state is changed.
When the c# programm is (re-)started the saved state should be restored in the page.
What is working so far:
Transmitting the state and saving it in c# is working:
exportState(){
if(navigator.userAgent === 'CEF')
{
let jsonstate = JSON.stringify(this.state.Fenster);
window.nativeHost.kontrolstate(jsonstate);
}
}
Fenster is an array of an own defined object.
To be able to push the saved state back to the react component I have created an ref:
<Kontrolle ref={(kont) => {window.Kontrolle = kont}} />
So I can call the procedures of component Kontrolle via a javascript call in CEFSharp.
To restore the state I call this procedure:
jsontostate(jsonstring){
var fen = jsonstring;
let fenster = this.state.Fenster;
for (var i=0; i<fen.length;i++) {
var f = fen[i];
let index = fenster.findIndex(x => x.id === f.id);
fenster[index].colum = f.colum;
fenster[index].offen = f.offen;
fenster[index].sort = f.sort;
}
this.setState({Fenster: fenster});
this.render();
}
It looks like working perfecly.
The state is updated correctly.
Also when I check the state in the debug console of CEFSharp it looks correctly.
There is also no error displayed in the console.
What is not working:
The state has influence to the page.
After calling the procedure the page is not rendered newly.
So the state and page are not in line.
I already have tried to force a render.
Without success.
Where is my mistake?
Can someone give me a hint?
reactjs cefsharp
edited Nov 18 '18 at 0:14
David
2,12122028
asked Nov 17 '18 at 23:17
Jürgen SchneideratJürgen Schneiderat
1
I am currently writing a ReactJS UI for my c# Project. It will run in a CEFSharp control.
Now I try to save the state of a Reacj object whenever the state is changed.
When the c# programm is (re-)started the saved state should be restored in the page.
What is working so far:
Transmitting the state and saving it in c# is working:
exportState(){
if(navigator.userAgent === 'CEF')
{
let jsonstate = JSON.stringify(this.state.Fenster);
window.nativeHost.kontrolstate(jsonstate);
}
}
Fenster is an array of an own defined object.
To be able to push the saved state back to the react component I have created an ref:
<Kontrolle ref={(kont) => {window.Kontrolle = kont}} />
So I can call the procedures of component Kontrolle via a javascript call in CEFSharp.
To restore the state I call this procedure:
jsontostate(jsonstring){
var fen = jsonstring;
let fenster = this.state.Fenster;
for (var i=0; i<fen.length;i++) {
var f = fen[i];
let index = fenster.findIndex(x => x.id === f.id);
fenster[index].colum = f.colum;
fenster[index].offen = f.offen;
fenster[index].sort = f.sort;
}
this.setState({Fenster: fenster});
this.render();
}
It looks like working perfecly.
The state is updated correctly.
Also when I check the state in the debug console of CEFSharp it looks correctly.
There is also no error displayed in the console.
What is not working:
The state has influence to the page.
After calling the procedure the page is not rendered newly.
So the state and page are not in line.
I already have tried to force a render.
Without success.
Where is my mistake?
Can someone give me a hint?
reactjs cefsharp
reactjs cefsharp
edited Nov 18 '18 at 0:14
David
2,12122028
asked Nov 17 '18 at 23:17
Jürgen SchneideratJürgen Schneiderat
1
edited Nov 18 '18 at 0:14
David
2,12122028
asked Nov 17 '18 at 23:17
Jürgen SchneideratJürgen Schneiderat
1
edited Nov 18 '18 at 0:14
David
2,12122028
edited Nov 18 '18 at 0:14
David
2,12122028
edited Nov 18 '18 at 0:14
David
2,12122028
2,12122028
asked Nov 17 '18 at 23:17
Jürgen SchneideratJürgen Schneiderat
1
asked Nov 17 '18 at 23:17
Jürgen SchneideratJürgen Schneiderat
1
asked Nov 17 '18 at 23:17
Jürgen SchneideratJürgen Schneiderat
1
1
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Found the reason by myself.
I did implement the compoinent Kontrolle twice.
One with ref one without ref.
I checked the redered UI on the wrong implementation.
So, my own mistake.
The code I have posted work fine.
Thanks to all.
answered Nov 18 '18 at 13:55
Jürgen SchneideratJürgen Schneiderat
1
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%2f53356476%2freactjs-in-cefsharp-save-state-and-restore-at-startup%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
Found the reason by myself.
I did implement the compoinent Kontrolle twice.
One with ref one without ref.
I checked the redered UI on the wrong implementation.
So, my own mistake.
The code I have posted work fine.
Thanks to all.
answered Nov 18 '18 at 13:55
Jürgen SchneideratJürgen Schneiderat
1
add a comment |
Found the reason by myself.
I did implement the compoinent Kontrolle twice.
One with ref one without ref.
I checked the redered UI on the wrong implementation.
So, my own mistake.
The code I have posted work fine.
Thanks to all.
answered Nov 18 '18 at 13:55
Jürgen SchneideratJürgen Schneiderat
1
add a comment |
Found the reason by myself.
I did implement the compoinent Kontrolle twice.
One with ref one without ref.
I checked the redered UI on the wrong implementation.
So, my own mistake.
The code I have posted work fine.
Thanks to all.
answered Nov 18 '18 at 13:55
Jürgen SchneideratJürgen Schneiderat
1
Found the reason by myself.
I did implement the compoinent Kontrolle twice.
One with ref one without ref.
I checked the redered UI on the wrong implementation.
So, my own mistake.
The code I have posted work fine.
Thanks to all.
answered Nov 18 '18 at 13:55
Jürgen SchneideratJürgen Schneiderat
1
answered Nov 18 '18 at 13:55
Jürgen SchneideratJürgen Schneiderat
1
answered Nov 18 '18 at 13:55
Jürgen SchneideratJürgen Schneiderat
1
answered Nov 18 '18 at 13:55
Jürgen SchneideratJürgen Schneiderat
1
1
add a comment |
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%2f53356476%2freactjs-in-cefsharp-save-state-and-restore-at-startup%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
