webentwicklung-frage-antwort-db.com.de

reagiere bootstrap schreibgeschützt in formcontrol

Ich verwende reagiere bootstrap und dieses Framework bietet einige nette FormControls.

Aber ich möchte das Eingabefeld, das innerhalb der FormControls generiert wird, eine Requisite von readonly = "readonly" haben. Auf diese Weise sieht dieses Feld genauso aus wie meine anderen FormControls, gibt jedoch unter IOS keine Tastatureingabe aus.

In meinem Fall wird die Eingabe von einer Kalenderauswahl bereitgestellt, die durch ein Popover ausgelöst wird.

Weiß jemand, wie man FormControl den Parameter readonly = "readonly" gibt, damit das generierte Eingabefeld im Browser die Eigenschaft readonly = "readonly" hat?

Vielen Dank für die Antworten!

14
user3611459

Es sieht nicht nach einem Problem mit React-Bootstrap aus, sondern nach React selbst. React überträgt die 'readonly'-Requisite nicht auf das generierte (echte) DOM-Element:

React-Bootstrap erstellt die folgende Eingabe für reaktive virtuelle Doms: enter image description here

React hat jedoch das folgende echte DOM-Element generiert, wobei das Attribut readonly weggelassen wurde: enter image description here

Vielleicht könnte die Verwendung von 'disabled' in Ihrem Fall helfen:

<FormControl
   disabled
   type="text"
   placeholder="Enter text"
   onChange={this.handleChange}
 />

Unterschiede zwischen readonly und disbabled finden Sie hier: https://stackoverflow.com/a/7730719/1415921

Ich habe ein Problem in Reacts Github-Repo erstellt: # 678


[~ # ~] update [~ # ~]

Nachdem Sie eine Antwort in der obigen Ausgabe erhalten haben. Sie müssen es mit camelcase schreiben: readOnly.

So sollte es sein:

<FormControl
   readOnly
   type="text"
   placeholder="Enter text"
   onChange={this.handleChange}
 />
33
omerts