为什么我必须在反应上下文对象中创建空函数？

Question

I'm trying to understand reacjs context API from docs. In the provided example on Updating Context from a Nested Component I found they created a context object like that :

export const ThemeContext = React.createContext({
  theme: themes.dark,
  toggleTheme: () => {},
});

So I asked what is the role of toggleTheme: () => {} . I found two live example for this snippet of code, They both using the same expression of empty function/method . I tried to remove it at all to see where it affect ... and I found nothing. Every thing working good, that makes me curious to know what it doing?

• first Live sinppet : https://codesandbox.io/s/73jkjq57lq
• second Live sinppet : https://codesandbox.io/s/p9p4jmqkq7

Thanks a lot...

Answer 1

At a first glance one can understand that in this context you can change a theme. As it is provided in the context object.

This is a method you are providing in the context:

toggleTheme: () => {},

if you need to change the theme, then you know that context is providing you one method named toggleTheme and as it is a method you can trigger it on the basis of your particular event such as mouseevents, keyboardevents or redux actions if it is implemented there.