Repository navigation
Allow replacing the anchoring element #2484
Description
i have the following html, using bootstrap3 and some theme
<ul class="nav navbar-top-links navbar-right">
<li class="dropdown">
<a class="dropdown-toggle count-info" data-toggle="dropdown" href="#">
<i class="fa fa-envelope"></i>
<span class="label label-warning">16
</span> </a>
<ul class="dropdown-menu dropdown-messages" id="latest-messages">
<li>
<div class="dropdown-messages-box">...
</div>
</li>
<li class="divider">
</li>
<li>
<a href="mailbox.html">
<i class="fa fa-envelope"></i> <strong>Read All Messages</strong></a>
</li>
</ul>
</li>
<li>...</li>
<li>...</li>
...
</ul>now I would like to render the ul#latest-messages with react
and IMHO that's currently impossible. why?
i have the following components:
Divider - div.divider
Message - div.dropdown-messages-box
LatestMessages = the ul#latest-messages
if i do this
React.renderComponent(LatestMessages(), li.dropdown); it replaces also my link with the icon
if i do this
React.renderComponent(LatestMessages(), ul#latest-messages); the i get two uls nested in each other
sure i could go up the hierarchy and convert more and more parent elements to react components, until i'm left with one single div i could anchor the all encompassing component to.
but i just want to the render the dropdown ul with react.
that's why react should have an option to replace the element given in renderComponent.
thanks for reading this long rant and hope for a solution soon
Activity
sophiebits commentedon Nov 8, 2014
Yes, currently you have to replace the entire contents of a container. After #1711 this won't be true any more, but the best workaround is probably to add an extra wrapping element around the
<ul>.bazo commentedon Nov 8, 2014
if i could i would do it. if add an extra wrapper the dropdown stops working. so i would have to modify 3rd party code(bootstrap, theme) or just code css overrides which is undesirable.
and the resulting html would not be correct
lggwettmann commentedon Apr 20, 2015
Will a fix be implemented soon into React? I really like it so far, but this is a major bummer unfortunately.
zpao commentedon Apr 20, 2015
No, I wouldn't expect this to change anytime soon. Maybe eventually.