How do I hide the default row number from the first column in a lightning-datatable (LWC) if the columns are editabl

default column numbers in lighting-datatable if the columns are editable.

<template>

    <div class="xxx">

        <template if:false={aaa}>

            <lightning-datatable

                    key-field={setKey}

                    data={tableData}

                    columns={columns}

                    onsave={handleTableSave}

                    draft-values={draftValues}

                    hide-checkbox-column

            >

            </lightning-datatable>

            <template if:true={isLoading}>

                <div class="loading-container">

                    <lightning-spinner alternative-text="Loading..." size="medium"></lightning-spinner>

                </div>

            </template>

        </template>

        <template if:true={aaa}>

            <lightning-datatable

                    key-field={setKey}

                    data={aggregates}

                    columns={bbbbColumns}

                    hide-checkbox-column

                    >

            </lightning-datatable>

        </template>

    </div>

</template>

I was using show-row-number-column = false but did not work.

I did try not using show-row-number-column according this stack post

How do I hide the default row number from the first column in a lightning-datatable (LWC)?

still nothing working.

I tried following the CSS, but this one only hides the row numbers of non-editable columns.In the table with editable columns, the row numbers are not hidden. Any suggestion is helpful.

.THIS tr td:first-child{

    display:none;

}

.THIS tr th:first-child{

    display:none;