【问题标题】:Re-sizing Google chart in react rnd在 React rnd 中重新调整 Google 图表的大小
【发布时间】:2019-04-04 12:14:06
【问题描述】:

我是反应新手,目前正在开发应用程序,

背景:

我正在尝试使用一个可调整大小的 rnd 组件,其中包含地理地图作为其内容。

问题:

尽管 rnd 组件调整大小工作正常,但 rnd 组件内的内容不会调整大小。

代码:

https://codesandbox.io/embed/15lo3mw93?fontsize=14

任何建议或提示都会有所帮助。

提前致谢。

【问题讨论】:

    标签: reactjs charts widget resizable


    【解决方案1】:

    你需要在调整大小时更新组件的状态,它会触发渲染并且地图应该得到正确的大小。

    <Rnd
        style={style}
        default={{
          x: 0,
          y: 0,
          width: "" + this.state.mappanelwidth + "",
          height: "" + this.state.mappanelheight + ""
        }}
        onResize={(e, direction, ref, delta, position) => {
          this.setState({
            mappanelheight: ref.offsetHeight,
            mappanelwidth: ref.offsetWidth
          });
        }}
      >
    

    【讨论】:

    • 先生,无法水平扩展 rnd 面板?我可能会出错的地方
    • 似乎是父容器的问题。检查这个:codesandbox.io/s/z3zr91ok73
    猜你喜欢
    • 2013-06-17
    • 2020-03-01
    • 2015-08-23
    • 2019-02-21
    • 1970-01-01
    • 2015-06-11
    • 2021-03-11
    • 2013-12-21
    相关资源
    最近更新 更多