React Style道具没有反映在IE中，getBoundingClientRect没有x和y

Question

我创建了一些带有内联样式的React.Portal，它们在Internet Explorer中根本没有呈现。

这是我的组成部分。

  const {
    x, y, height, width,
  } = popupAnchorRef.getBoundingClientRect();

  return ReactDOM.createPortal(
    <div
      ref={popupRef}
    >
      <div
        role="presentation"
        className={popupAnchorStyle}
        style={{
          left: x,
          top: topPositionAnchor,
        }}
      />
      <div
        className={popupStyle}
        style={styleForPopupPosition}
      >
        <PopupContents alias={alias} handleClosePopup={handleClosePopup} />
      </div>
    </div>
    ,
    document.body,
  );
};

我在html <meta http-equiv="X-UA-Compatible" content="IE=edge">中有这个元素

注意：内联样式正在处理任何其他组件。

Answer 1

好的，问题出在getBoundingClientRect中

  const {
    x, y, height, width,
  } = popupAnchorRef.getBoundingClientRect();

互联网资源管理器没有x和y属性，他们有left和right