Javascript 检查元素是否有滚动-reactjs

我有

附在

中。每当我们有更多数据时，

将有垂直滚动，在这种情况下，我想使表格宽度为100%，如果没有垂直滚动，我想使表格宽度为98%

render() {
  return (
    <div onScroll={this.handleScroll} className="scroll-property">
      <table className="react-listing-table table" width={this.setWidth()+'%'}>
      ...
  );
}

setWidth(){
  let dom = ReactDOM.findDOMNode(this).parentNode;
  let hasVerticalScrollbar = dom.scrollHeight > dom.clientHeight;

  if (hasVerticalScrollbar) {
    return 100;
  } else {
    return 98;
  }
}

---

当在

render

函数中调用

setWidth

时，请指导我，DOM实际上还不存在。这是您希望在

componentDidMount

中执行的操作，也可能是

componentdiddupdate

中使用表的ref

tableRef = null

render() {
  return (
    <div onScroll={this.handleScroll} className="scroll-property">
      <table className="react-listing-table table" ref={el => this.tableRef = el}>
      ...
  );
}

componentDidMount() {
  this.tableRef.width = this.setWidth() + '%'
}

componentDidUpdate() {
  this.tableRef.width = this.setWidth() + '%'
}

tableRef=null
render（）{
返回(
this.tableRef=el}>
...
);
}
componentDidMount（）{
this.tableRef.width=this.setWidth（）+'%
}
componentDidUpdate（）{
this.tableRef.width=this.setWidth（）+'%
}

在

render

函数中调用

setWidth

时，DOM实际上还不存在。这是您希望在

componentDidMount

中执行的操作，也可能是

componentdiddupdate

中使用表的ref

tableRef = null

render() {
  return (
    <div onScroll={this.handleScroll} className="scroll-property">
      <table className="react-listing-table table" ref={el => this.tableRef = el}>
      ...
  );
}

componentDidMount() {
  this.tableRef.width = this.setWidth() + '%'
}

componentDidUpdate() {
  this.tableRef.width = this.setWidth() + '%'
}

tableRef=null
render（）{
返回(
this.tableRef=el}>
...
);
}
componentDidMount（）{
this.tableRef.width=this.setWidth（）+'%
}
componentDidUpdate（）{
this.tableRef.width=this.setWidth（）+'%
}

你能试试

绑定
这个.setWidth
吗？似乎您正在调用
setWidth
方法上的
findDOMNode
，而不是组件。您可以尝试
.bind
ing
this.setWidth
？似乎您在调用
setWidth
方法上的
findDOMNode
，而不是组件。