George Mauer George Mauer - 1 month ago 15
React JSX Question

Does react have a "null element"?

I have a piece of a component that looks like this

c.props.results.totalCount > c.props.searchOptions.perPage
? createElement(ReactPaginate, {
previousLabel: "<",
nextLabel: ">",
pageNum: Math.ceil(c.props.results.totalCount / c.props.searchOptions.perPage),
marginPagesDisplayed: 2,
pageRaneDisplayed: 5,
containerClassName: "pagination",
activeClass: "active",
forceSelected: c.props.searchOptions.page,
clickCallback: noop
})
: null


Basically, if there is anything to page, include a pager widget, otherwise don't.

I'd like to encapsulate this logic in its own component.

createElement(OptionalPager, c.props)


The only problem is that the render function can't return
null
and I'd prefer not to insert an intermediate element here. Is there some sort of
React.DOM.null
element that I can return instead?

Answer

The render function for your class should be able to accept null.

https://facebook.github.io/react/blog/2014/07/17/react-v0.11.html

If you are calling React.render yourself though you can render noscript just like they do

React.render(<noscript />, ...)
Comments