滚动ag-grid时，标题朝相反的方向

Question

滚动ag-grid时，标题朝相反的方向。

仅在使用RTL网格时会发生这种情况

请参阅附件。

Answer 1

此错误再次出现在Chrome 85上（因为Chrome更改了RTL计算布局）

Chrome 85 Update breaks the ag-grid ui and scroll in RTL

Ag-Grid已在24.0.0版上修复

像21.2.2之类的旧版本更改Utils.ts文件的路径并使用代码

在/src/agGrid.ts上创建agGrid.ts并将其复制到以下代码段

/**
 * RTL scrolling breaks with Chrome 85
 * Fix Version: 24.0.0
 * File: https://github.com/ag-grid/ag-grid/blob/master/community-modules/core/src/ts/utils/dom.ts
 * commit: https://github.com/ag-grid/ag-grid/commit/acffa118e0c705d17786377bd43a9fca247cdf72
 */

import { Utils } from "ag-grid-community/dist/lib/utils/general";

let rtlNegativeScroll: boolean;
export function isRtlNegativeScroll(): boolean {
    if (typeof rtlNegativeScroll === "boolean") {
        return rtlNegativeScroll;
    }

    const template = document.createElement("div");
    template.style.direction = "rtl";
    template.style.width = "1px";
    template.style.height = "1px";
    template.style.position = "fixed";
    template.style.top = "0px";
    template.style.overflow = "hidden";
    template.dir = "rtl";
    template.innerHTML = /* html */
        `<div style="width: 2px">
            <span style="display: inline-block; width: 1px"></span>
            <span style="display: inline-block; width: 1px"></span>
        </div>`;

    document.body.appendChild(template);

    template.scrollLeft = 1;
    rtlNegativeScroll = template.scrollLeft === 0;
    document.body.removeChild(template);

    return rtlNegativeScroll;
}

Utils.setScrollLeft = (element: HTMLElement, value: number, rtl: boolean): void => {
    if (rtl) {
        // Chrome and Safari when doing RTL have the END position of the scroll as zero, not the start
        if (isRtlNegativeScroll()) {
            value *= -1;
        } else if (Utils.isBrowserSafari() || Utils.isBrowserChrome()) {
            value = element.scrollWidth - element.clientWidth - value;
        }
    }
    element.scrollLeft = value;
};
Utils.getScrollLeft = (element: HTMLElement, rtl: boolean): number => {
    let scrollLeft = element.scrollLeft;

    if (rtl) {
        // Absolute value - for FF that reports RTL scrolls in negative numbers
        scrollLeft = Math.abs(scrollLeft);

        if (Utils.isBrowserChrome() && !isRtlNegativeScroll()) {
            scrollLeft = element.scrollWidth - element.clientWidth - scrollLeft;
        }
    }

    return scrollLeft;
};

将代码段导入到main.ts

import "./agGrid";