Howdy Folks, While working with Kotlin-react, I have issues implementing the react-router with the r...

# javascript

[Kelvin Ojiako]

Howdy Folks, While working with Kotlin-react, I have issues implementing the react-router with the route component. I posted a stackOverflow question about it a couple hours ago and figured this might be a better platform for asking. In summary, while using the route component, I can't seem to figure out how to safely pass the element prop which requires an object of ReactNode?. I also tried calling the create method for the function component but it still does not work. Can anyone help out with implementing the react router using the browser router and router API?

[turansky]

Which wrappers version do you use?

[turansky]

To create ReactElement you can use create extension. Example

[Kelvin Ojiako]

I'm using the most recent Wrapper version I think

[Kelvin Ojiako]

So I tried applying the example and the error goes away. I added the first screenshot to show how the more recent update. However, I can't seem to get the aboutUs page to load

[turansky]

However, I can’t seem to get the aboutUs page to load

index = true
It’s Kotlin! 😜

[Kelvin Ojiako]

lol yea Thanks for the help so far, I made the change but I still get the same error when trying to route to /aboutUs. Are there any alternatives to using element = Fragment.create(). Can't really seem to pinpoint where I'm going wrong

[turansky]

In your example wrapping with Fragment isn’t required

[turansky]

element = Home.create()

[turansky]

For accessing /about after page restart you need server routing
Related issues you can find in this channel and/or in wrappers GitHub issues

[Kelvin Ojiako]

ooh really? I was trying to use BrowserRouter so as to not need a Server for the routing, was under the impression that with react-router, routing can be enabled without having a backend server

[Kelvin Ojiako]

I made the change but I still cant access the /aboutUs page. So I'm guessing I'm gonna have to go with a Kotlin multiplatform application with a JVM backend with the Ktor framework? it seems like overkill for a simple application tbh lol

[turansky]

If you are ready for hashes - no server/Ktor required
https://reactrouter.com/en/main/router-components/hash-router

[Kelvin Ojiako]

oou nice, I will check that out. Appreciate the help victor👍

[turansky]

Example

[turansky]

FYI

Current version - pre.499

[Kelvin Ojiako]

Experimented with using BuildElement for adding components to the element prop and it works as a good alternative to the create but It seems I'm using it wrong. Instead I get no routes matched url error. Edit: the home page component works but the about doesnt

[Kelvin Ojiako]

image.png

[Kelvin Ojiako]

Appreciate the info this far, So i went back to using the .create method with the hashRouter, but the other routing components url still does not work. I believe I'm using the HashRouter correctly. Have attached screenshot below that shows the recent changes but the aboutUs component cant be triggered fo some reason

[Kelvin Ojiako]

Guessing I'll have to start looking into ktor Server, guess it would be better to make another gradle project to act as jvm backend? tied kotlin multiplatform the other day and was getting errors about sl4j logging, figured its still quite experimental to use smoothly