React Input with disabled

Question

나는 그 소품에서 전달 된 disabled 불린과 함께 입력을 가지고있다. 나는 그 비활성화 된 변수가 설정되어 있음을 발견했습니다. 심지어 그것이 사실 일 때도 입력을 입력 할 수 없습니다. 그러나 내가 입력 할 때 마우스를 아래로 잡고 입력을 계속하면 입력을 입력 할 수 있습니다.

구성 요소를 제어되거나 제어되지 않는 상태로 렌더링 할 때 발생합니다.

수정하는 유일한 방법은 disabled을 삭제하거나 disabled={false}을 설정하는 것입니다.하지만이를 변경해야합니다.

class DashboardWidgetTitle extends React.Component { 

    constructor(props) { 
     super(props); 
     this.state = {}; 
     this.state.title = props.widget.getTitle(); 
    } 

    render() { 
     return <input className="title" 
        value={this.state.title} 
        disabled={!this.props.isEditMode} 
        onChange={this._onInputChange.bind(this)}/> 
    } 

    _onInputChange(e) { 
     logit("input change"); 
     this.setState({title: e.target.value}); 
    } 

    } 

감사 :

이 내 입력!

편집 : 추가 정보 -

• 이것은 ReactGridLayout의 구현에서 위젯에 사용됩니다.
• 구성 요소는 반응 격자 레이아웃 인 "대시 보드"구현으로 렌더링되는 위젯에 의해 렌더링됩니다. 대시 보드의 각도는 isEditMode이며 Angular (외부에서 React within Angular) 토글을 통해 외부로 변경된 상태입니다.
• 탭을 전환했다가 다시 돌아 오면 초점이 유지됩니다. 그렇지 않으면 문자를 입력 할 때마다 입력이 초점을 잃게됩니다.
• 입력이 비활성화되어 있으면 안되며, 집중 문제 만 있습니다. disabled 특성을 제거하거나 정적 변수로 설정하더라도 문제가 남아 있지 않습니다.
• !isEditMode이 아닌 비활성화 된 토글을 isEditMode으로 전환하면 모든 기능이 작동합니다. ReactGridLayout의 draggable/resizable 부분에 onclick이있어 문제가 발생하는 것 같습니다.

Answer 1

내 문제는 바로 여기에 설명했다 : 가난한 연구의 https://github.com/STRML/react-grid-layout/issues/615

내 자신의 잘못. ` ` :