javascript - 添加新组件时不重新渲染组件数组-react.js

所以我有这段代码：

import React, { Component } from 'react';

import StartMultiple from './Start.multiple.js';

export default class Start extends Component {
    constructor()
    {
        super();
        this.state = {count: 4};
        this.count = 4;
        this.repeats = [
            <StartMultiple key="1"/>,
            <StartMultiple key="2"/>,
            <StartMultiple key="3"/>
        ];

    }

    add_repeat(e)
    {
        this.repeats.push(<StartMultiple key={this.count}/>);
        this.count = this.count + 1;
        console.log(this.repeats);
    }

    render()
    {
        var count = 1;

        return(
            <div>
                {this.repeats}

                <button onClick={ () => this.add_repeat(event)}>clickable</button>
            </div>
        );
    }
}

但是，每当我按下按钮时，就一定会添加该组件（如console.log中所示），但是dom不会重新呈现新组件。我想念什么吗？

最佳答案

这是因为您没有使用状态。而是创建了自己的变量...

将重复变量置于状态内。并使用this.setState设置新值