我點擊數字可以自增，然后改變按鈕的值變成不改變，點擊不改變再變成改變

我點擊數字可以自增1，然后改變按鈕的值變成不改變，此時數字無法自增，點擊不改變按鈕后，按鈕的值再變成改變，此時值可以自增，不斷如此，請問如何實現？

import React from 'react';

class Basic extends React.Component {

    constructor() {

        super();
        this.state = {
            changeValue: '', // 任務欄改變值
            isLocked: true,
            value: 2
        }
        this.changeHandle = this.changeHandle.bind(this);

        this.setValue = this.setValue.bind(this);

    }

    setValue() {
        this.setState({
            value: this.state.value + 1
        })
    }

    changeHandle(content, event){
        console.log('傳遞的內容 = ' + content)
        this.setState({
            isLocked: !this.state.isLocked
        })
    }
    
    componentWillMount() {

        console.log('組件將要渲染')

        this.setState({
            value: this.state.value + 1
        })
    }



    componentDidMount(){
        console.log('組件正式渲染')
    }

    render() {

        console.log('渲染render()')

        var divStyle = {

        }

        var valueStyle = {
            fontSize: 50,
            color: '#FF0004'
        }

        return (

            <div id style={divStyle} className='data-line'>
                <div>
                    <div style={valueStyle} onClick={this.setValue}>{this.state.value}</div>
                </div>
                <div>
                    {this.state.isLocked ?
                        <button onClick={this.changeHandle.bind(this, '人生不如意')}>改變</button> :
                        <button>無法點擊按鈕</button>
                    }
                </div>

            </div>
        )
    }
}

export default Basic;