Javascript 使用ref（第三方库）更改元素

我使用第三方库显示带有寻呼机的表格：

<Grid 
    ref={Grid => {
      this.gridRef = Grid;
    }}
    {...props} />

我可以使用

innerHTML

添加简单文本，但是如何添加React类

GridPager

？

---

这是我第一次使用ref并使用React处理DOM。

根据我所知道的，您正在尝试/想要做的事情既不可能，也不鼓励

应该没有办法像那样主动修改React DOM

childNodes

元素应该是只读的，即使您仍然可以修改内部HTML

ref

s应用于在React DOM的不同组件之间触发事件，因为某些原因，您不想使用道具传递函数

在这里看到更多

这里呢

---

我知道您尝试这样做的原因和原因，但是如果您使用的是一个您没有创建的组件，我认为在包装或使用它的代码上尝试修改它不是一个好主意，而是直接从源代码进行更改。

此库的开发人员（KnedoUI）提供了一种使用JQuery更改的官方方法。我以前没有在任何时候使用

ref

，但在这个场景中，我认为这是一个真正的需要。谢谢@Carlo:）

componentDidMount() {
  // display the Grid elements
  //console.log(this.gridRef.widgetInstance.element);

  // This won't work
  //this.gridRef.widgetInstance.element[0].childNodes[1] = <GridPager />; 

  // Change the Grid pager to simple 'test'
  // this.gridRef.widgetInstance.element[0].childNodes[1].innerHTML = 'test'; 
}