简体   繁体   中英

react-electron ipcRenderer in useEffect does not rerender

I'm trying to make a global accessible object, so that its values can be changed and can be read from every component. I've create a classs with static fields:

export default class Settings {
  static first: string;

  static second: string;
}

Lets say I have two components in separate files:

import Settings from './Settings'

// located in firstComponent file
export default function FirstComponent() {
Settings.First = 'test'    <---------------- SET VALUE
return (some html)
}

// located in secondComponent file
export default function SecondComponent() {
let qq = Settings.First <----------------------- ASSUME HERE IS VALUE "TEST"
}

But it is not working. How I can create static class/fields that will be accessible within all components like C# static classes. Is it even possible?

Thanks in advance

UPD Looks like the problem in ipcRenderer:

export default function SettingsEditor() {
  const [state, setState] = React.useState({
    ipAddress: Settings.ipAddress,
  });

  useEffect(() => {
    electron.ipcRenderer.once('readSettings', (args) => {
      console.log('Filling settings');
      console.log(args); <------ HERE WE HAVE VALUE like 10.10.10.10
      setState({ ...state, ipAddress: args.ipAddress});
      console.log(state.ipAddress); <------ UNDEFINED
      state.ipAddress = args.ipAddress;
      console.log(state.ipAddress); <------ UNDEFINED
      Settings.ipAddress= args.ipAddress;
      console.log(Settings.gateIpAddress); <------ UNDEFINED
    });
    electron.settingsApi.read();
  }, []);

How I can handle this?

The reason is - I'm stupid =)

When I save settings I did it like this:

    const settings = new Settings();
    settings.ipAddress= state.ipAddress;
    console.log(JSON.stringify(settings));
    electron.settingsApi.save(settings);   <------ PASS OBJECT

But when I return response it was:

ipcMain.on('readSettings', (event, _) => {
  storage.getAll((err: Error, data: object) => {
    if (err) {
      return;
    }
    const { appSettings } = data;
    const settings = new Settings();
    settings.ipAddress= appSettings.ipAddress;
    console.log('reading settings');
    console.log(JSON.stringify(settings));
    event.reply('readSettings', JSON.stringify(settings)); <-------- FACEPALM
  });
});

What I can say - genius

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM