React：我可以操作DOM React渲染了多少？

这是我在做什么： http://jsfiddle.net/iamnoah/pTrrw/

关键部分是：@H_301_2@

position: function() {
  var container = $(this.getDOMNode());
  this._menu = $(this.refs.menu.getDOMNode());
  this._menu.appendTo(document.body).
      offset({
          top: container.offset().top + 
              container.outerHeight(),left: container.offset().left
      });
},restore: function() {
  this._menu.appendTo(this.getDOMNode());      
},componentWillUpdate: function() {
  this.restore();
},componentDidUpdate: function() {
  this.position();
},componentDidMount: function() {
  this.position();
},

这工作伟大的现在。我把组件更新之前的内容，假设React在更新之间单独保留DOM，不会错过它。事实上，React似乎对移动内容很好(如果我删除componentWillUpdate和componentDidUpdate，定位的元素仍然更新！)@H_301_2@

我的问题是有多少结果假设是安全的(即，如果我假设这些事情，我的代码会在React的未来版本中打破？)：@H_301_2@

> React不关心DOM是否在更新之间移动，只要将它放回componentWillUpdate即可。
> React事件处理程序仍然可以处理已经移动的元素。
> React将合并任何内联样式，它使用元素上已有的样式(即使它没有设置它们)。
> React会更新它呈现的DOM，即使你将DOM移动到文档中的其他位置也是如此！@H_301_2@

最后一个似乎有点极端，神奇的我，但有一些很大的影响，如果它持有。@H_301_2@

我是一个React dev。我会回答你的每个问题：

React does not care if DOM is moved around between updates as long as you put it back in componentWillUpdate.@H_301_2@

True – React不会查看DOM，除非更新时，除了事件处理程序：@H_301_2@

React event handlers will still work on elements that have been moved.@H_301_2@

我不会依赖这个，我不知道它现在甚至是真的。@H_301_2@

React will merge any inline styles you ask it with styles already on the element (even if it did not set them.)@H_301_2@

我也不会依赖这个 – 现在React设置单个属性，但我可以很容易想象它设置el.style.cssText如果这是更快，这将吹走你所做的个人更改。@H_301_2@

React will update DOM it has rendered,even if you move that DOM somewhere else in the document!@H_301_2@

我不相信这是真的目前，你也不应该依赖于这一点。@H_301_2@

一般来说，你不应该手动操作React创建的DOM。创建一个空的< div>是100％的犹太教在React和手工填充它;甚至可以修改React渲染的元素的属性，只要你以后不尝试在React中改变它的属性(使React执行DOM更新)，但是如果你移动一个元素，React可能会寻找它，当它找不到它时会感到困惑。@H_301_2@

希望有帮助。@H_301_2@

React：我可以操作DOM React渲染了多少？

猜你在找的React相关文章