What is the equivalent to render for react-basic-native?

[jerbaroo]

Hi, I'm really interested in using this library for a react-native application at the company I work for. However I am having a hard time getting the most simple example working. I can't seem to find the equivalent to render for react-basic-hooks.

[jerbaroo]

To give a little more context, I am trying to finish this example:

main :: Effect Unit
main = do
  ex <- mkCounter
  ??? ex 0

mkCounter :: Component Int
mkCounter = do
  component "Counter" \initialValue -> React.do
    counter /\ setCounter <- useState initialValue
    pure $ R.button
      { onPress: capture_ (setCounter (_ + 1))
      , title: "Increment: " <> (show counter)
      }

[jerbaroo]

Okay turns out it is this simple :)

# Main.purs
main :: Effect JSX
main = do
  ex <- mkCounter
  pure $ ex 0

# App.js
import { main } from "./output/Main";

export default function App() {
  return main();
}

[maddie927]

render from React.Basic.DOM works for components made with this library. react-basic-native should have its own equivalent "render the app root" concept, and that should also be compatible with this library.

[jerbaroo]

Okay thank you for the information.

I am trying out a react-basic-native application and went with the approach outlined in the comment above, does that look okay to you?

Just to confirm, when you say "should have its own equivalent "render the app root" concept" you mean that this does not current exist?

[maddie927]

It's just that I'm not very familiar with react native, so I don't know if I can answer whether that's a good approach 😅. I know react native app mounting is a bit different from web though. If you're just worrying about making the top level PS type a react component and then wiring that up in JS that should be fine.