Phoenix.React.Helper (Phoenix.React v0.5.2)

View Source

A helper to render react component by react-dom/server in Phoenix.Component.

Usage:

# in html_helpers in AppWeb.ex
import Phoenix.React.Helper

Summary

Functions

A helper to render react component by react-dom/server in Phoenix.Template.

Functions

react_component(assigns)

A helper to render react component by react-dom/server in Phoenix.Template.

attrs:

  • component: react component name
  • props: props will pass to react component
  • static: when true, render to static markup, false to render to string for client-side hydrate

Examples

<.react_component
  component="awesome-chart"
  props={%{ data: @chart_data }}
  static={false}
/>

component

Component file is set at Application.get_env(:phoenix_react_server, Phoenix.React)[:component_base] The component file should export a Component function:

import Chart from 'awesome-chart';
export const Component = ({data}) => {
  return <Chart data={data} />;
}

Attributes

  • component (:string) (required) - react component name.

  • props (:map) - props will pass to react component. Defaults to %{}.

  • static (:atom) - when true, render to static markup when false render to string when nil render to readable stream

    Defaults to nil.