Почему он запускается в бесконечный цикл после того, как я установил rowKey в Math.случайный в rc-таблице?

Могу я использовать Math.randomдля rowKeyвнутри rc-table?
Почему он запускается в бесконечный цикл после обновления компонента, если я установил значение rowKeyMath.random?

import React from 'react';
import RcTable from 'rc-table';

class Folder extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            update: false,
        };
    }

    componentDidMount() {
        var id = setInterval(() => {
            clearInterval(id);
            this.setState({
                update: !this.state.update,
            });
        }, 4000);
    }


    renderTable() {
        const columns = [
            {
                title: 'name',
                dataIndex: 'name',
                key: 'name',
                width: 280,
            },
        ];

        const data = [
            {
                name: '12',
                id: 1,
            },
            {
                name: '123',
                id: 2,
            },
            {
                name: '1245',
                id: 3,
            },
            {
                name: '12345',
                id: 4,
            },
        ];

        return <RcTable data={data} columns={columns} rowKey={() => Math.random()} />
    }

    render() {
        return (
            <div>
                {this.renderTable()}
            </div>
        );
    }
}

export default Folder;

Сначала он работает нормально. Но при обновлении компонента Uncaught RangeError: Maximum call stack size exceededбудет выдана ошибка.

Если я изменю rowKeyнаid, все будет в порядке.

Почему это вызовет бесконечный цикл обновления ?

1 ответ

  1. Как указано здесь

    rowKey

    строка или функция (запись):string

    ‘key’

    Если rowKey строка, record[rowKey]будет использоваться в качестве ключа. Если rowKey
    функция, возвращенное значение rowKey(record)будет использовать как ключ.

    Таким образом, в вашем компоненте вы не можете использовать Random Number

    rowKey={() => Math.random()}
    

    Которая является функцией и не возвращает ничего, кроме void.

    The rowKeymust be valid keyused by the table.

    Это может быть причиной для вашего Stack error