Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support for mixed-mode Feliz & Fable.React code? #11

Open
l3m opened this issue Jun 20, 2020 · 2 comments
Open

Support for mixed-mode Feliz & Fable.React code? #11

l3m opened this issue Jun 20, 2020 · 2 comments
Labels
question Further information is requested

Comments

@l3m
Copy link

l3m commented Jun 20, 2020

I have a code base written mostly in Fable.React. I'm interested in using Feliz & Feliz.ViewEngine.

However, my existing code is using Fable.React's ReactDomServer to perform SSR. Adding Feliz, I would need to have a way to support both Fable.React-style code as well as Feliz.

I can imagine this might be out of scope, but .. can't hurt to ask, right? Is that something that is possible, or even reasonable?

@dbrattli
Copy link
Owner

dbrattli commented Jun 21, 2020

The README mentions this problem. The way I would think about this is that SSR is just HTML, or at least it will end up as HTML. So you can always wrap your Fable.React / Feliz code and use some translate function (e.g type prop extension) that uses prop.dangerouslySetInnerHTML (content: string) one way or the other. Then make sure what the client generates matches this HTML.

type prop with
    static member inline react (content: ReactElement) =
        let text = ... /// Convert your Fable.React into a string
        Interop.mkChildren [ Interop.createRawTextElement text ]

It's hard to add such a translate method for Fable.React to Feliz.ViewEngine without taking dependency to Fable.React so it's best to do it in the project that already have the dependency. But if you get it working we should document it to the README.

@l3m
Copy link
Author

l3m commented Jun 21, 2020

Thanks! I'll see if I get this to work.

@dbrattli dbrattli added the question Further information is requested label Oct 10, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

2 participants