/// <summary> /// Transforms the React.createElement expression. /// This is useful for libraries like styled components which require wrapping the root component /// inside a helper to generate a stylesheet. /// Example transform: React.createElement(Foo, ...) => wrapComponent(React.createElement(Foo, ...)) /// </summary> /// <param name="componentToRender">The Javascript expression to wrap</param> /// <returns>A wrapped expression</returns> public string WrapComponent(string componentToRender) { return(m_renderFunctions == null ? WrapComponentCore(componentToRender) : m_renderFunctions.WrapComponent(WrapComponentCore(componentToRender))); }
/// <summary> /// Renders the HTML for this component. This will execute the component server-side and /// return the rendered HTML. /// </summary> /// <param name="writer">The <see cref="T:System.IO.TextWriter" /> to which the content is written</param> /// <param name="renderContainerOnly">Only renders component container. Used for client-side only rendering.</param> /// <param name="renderServerOnly">Only renders the common HTML mark up and not any React specific data attributes. Used for server-side only rendering.</param> /// <param name="exceptionHandler">A custom exception handler that will be called if a component throws during a render. Args: (Exception ex, string componentName, string containerId)</param> /// <param name="renderFunctions">Functions to call during component render</param> /// <returns>HTML</returns> public virtual void RenderHtml(TextWriter writer, bool renderContainerOnly = false, bool renderServerOnly = false, Action <Exception, string, string> exceptionHandler = null, RenderFunctions renderFunctions = null) { if (!_configuration.UseServerSideRendering) { renderContainerOnly = true; } if (!renderContainerOnly) { EnsureComponentExists(); } var html = string.Empty; if (!renderContainerOnly) { var stringWriter = _sharedStringWriter; if (stringWriter != null) { stringWriter.GetStringBuilder().Clear(); } else { _sharedStringWriter = stringWriter = new StringWriter(new StringBuilder(_serializedProps.Length + 128)); } try { stringWriter.Write(renderServerOnly ? "ReactDOMServer.renderToStaticMarkup(" : "ReactDOMServer.renderToString("); if (renderFunctions != null) { stringWriter.Write(renderFunctions.WrapComponent(GetStringFromWriter(componentInitWriter => WriteComponentInitialiser(componentInitWriter)))); } else { WriteComponentInitialiser(stringWriter); } stringWriter.Write(')'); if (renderFunctions != null) { renderFunctions.PreRender(x => _environment.Execute <string>(x)); html = _environment.Execute <string>(renderFunctions.TransformRenderedHtml(stringWriter.ToString())); renderFunctions.PostRender(x => _environment.Execute <string>(x)); } else { html = _environment.Execute <string>(stringWriter.ToString()); } if (renderServerOnly) { writer.Write(html); return; } } catch (JsRuntimeException ex) { if (exceptionHandler == null) { exceptionHandler = _configuration.ExceptionHandler; } exceptionHandler(ex, ComponentName, ContainerId); } } writer.Write('<'); writer.Write(ContainerTag); writer.Write(" id=\""); writer.Write(ContainerId); writer.Write('"'); if (!string.IsNullOrEmpty(ContainerClass)) { writer.Write(" class=\""); writer.Write(ContainerClass); writer.Write('"'); } writer.Write('>'); writer.Write(html); writer.Write("</"); writer.Write(ContainerTag); writer.Write('>'); }