+{"pageProps":{"content":"[[\"$r\",\"MaxWidth\",\"20\",{\"children\":[[\"$r\",\"Intro\",null,{\"children\":[\"$r\",\"p\",null,{\"children\":\"Interoperability (Interop for short) is the exchange of information between two systems. In the case of ReactUnity, the two systems are React (Javascript), and the Unity (C#). Interop refers to the exchange of data, function calls and events between these two systems.\"}]}],\"\\n\",[\"$r\",\"h2\",null,{\"id\":\"ways-to-achieve-interop\",\"children\":\"Ways to achieve interop\"}],\"\\n\",[\"$r\",\"p\",null,{\"children\":\"There are several ways to achieve interop in ReactUnity.\"}],\"\\n\",[\"$r\",\"h3\",null,{\"id\":\"globals-object\",\"children\":[[\"$r\",\"code\",null,{\"children\":\"Globals\"}],\" object\"]}],\"\\n\",[\"$r\",\"p\",null,{\"children\":[\"This method uses the \",[\"$r\",\"code\",null,{\"children\":\"Globals\"}],\" object to have two-way communication between React and C#. Also, \",[\"$r\",\"code\",null,{\"children\":\"useGlobals\"}],\" is a hook that is available in React side and it re-renders the component when \",[\"$r\",\"code\",null,{\"children\":\"Globals\"}],\" object changes.\"]}],\"\\n\",[\"$r\",\"p\",null,{\"children\":[\"API reference for \",[\"$r\",\"code\",null,{\"children\":\"useGlobals\"}],\" can be found \",[\"$r\",\"a\",null,{\"href\":\"/reference/api/useglobals\",\"children\":\"here\"}],\".\"]}],\"\\n\",[\"$r\",\"p\",null,{\"children\":[[\"$r\",\"code\",null,{\"children\":\"useReactiveValue\"}],\" is a further hook that can be used to re-render on individual property changes of a C# object, see \",[\"$r\",\"a\",null,{\"href\":\"/reference/api/usereactivevalue\",\"children\":\"here\"}],\".\"]}],\"\\n\",[\"$r\",\"h3\",null,{\"id\":\"interop-namespace\",\"children\":[[\"$r\",\"code\",null,{\"children\":\"Interop\"}],\" namespace\"]}],\"\\n\",[\"$r\",\"p\",null,{\"children\":[[\"$r\",\"code\",null,{\"children\":\"Interop\"}],\" is a namespace in React side that can be used to call C# and Unity static functions from React side. It allows doing C# operations without going out of Javascript.\"]}],\"\\n\",[\"$r\",\"p\",null,{\"children\":[[\"$r\",\"code\",null,{\"children\":\"Interop\"}],\" namespace exports some C# namespaces that you can use. These are: \",[\"$r\",\"code\",null,{\"children\":\"System\"}],\", \",[\"$r\",\"code\",null,{\"children\":\"Unity\"}],\" and \",[\"$r\",\"code\",null,{\"children\":\"UnityEngine\"}],\".\"]}],\"\\n\"]}],[\"$r\",\"Sandpack\",null,{\"children\":[\"$r\",\"pre\",null,{\"children\":[\"$r\",\"code\",null,{\"className\":\"language-js\",\"children\":\"export default function App() {\\n const ref = React.useRef();\\n const randomize = () => {\\n const r = Math.random();\\n const g = Math.random();\\n const b = Math.random();\\n const color = new Interop.UnityEngine.Color(r, g, b);\\n ref.current.Style.backgroundColor = color;\\n };\\n\\n return <>\\n <button onClick={randomize} ref={ref}>\\n Randomize color\\n </button>\\n </>;\\n}\\n\"}]}]}]]","toc":"[{\"url\":\"#\",\"text\":\"Overview\",\"depth\":2},{\"url\":\"#ways-to-achieve-interop\",\"depth\":2,\"text\":\"Ways to achieve interop\"},{\"url\":\"#globals-object\",\"depth\":3,\"text\":[[\"$r\",\"code\",null,{\"children\":\"Globals\"}],\" object\"]},{\"url\":\"#interop-namespace\",\"depth\":3,\"text\":[[\"$r\",\"code\",null,{\"children\":\"Interop\"}],\" namespace\"]}]","meta":{"title":"React - C# communication (Interop)"}},"__N_SSG":true}
0 commit comments