Material - UI TextField değişken etiketi değerle çarpıyor

Question 1

Kullanmaya çalışıyorum TextField belirtilen değişken ile Malzeme-UI bileşeni, ama nedense etiketin düzgün değer geçer? Bu durumu nasıl düzeltebilirim?

Etiket ve değer karışık metin alanının ekran görüntüsü

Aşağıda çoğalttım codesandbox.io:

https://codesandbox.io/s/angry-borg-2ojel?file=/src/App.tsx

Uygulama.tsxname

import { TextField } from "@material-ui/core";
import "./styles.css";

export default function App() {
  return (
    <div className="App">
      <TextField variant="outlined" label="Label" value="Vest" />
    </div>
  );
}

paket.jsonname

    "@material-ui/core": "4.12.3",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "react-scripts": "4.0.3"

Question 2

Eklemek InputLabelProps={{ shrink: true }} bir "küçülme" durumunu zorlamak için TextField bu durumda etiketi alanın anahattı üzerinde oluşturması gereken denetim.

import { TextField } from "@material-ui/core";
import "./styles.css";

export default function App() {
  return (
    <div className="App">
      <TextField variant="outlined" label="Label" value="Vest" InputLabelProps={{ shrink: true }}/>
    </div>
  );
}

Martin Devillers · Answer 1 · 2021-11-24T02:42:16

Eklemek InputLabelProps={{ shrink: true }} bir "küçülme" durumunu zorlamak için TextField bu durumda etiketi alanın anahattı üzerinde oluşturması gereken denetim.

import { TextField } from "@material-ui/core";
import "./styles.css";

export default function App() {
  return (
    <div className="App">
      <TextField variant="outlined" label="Label" value="Vest" InputLabelProps={{ shrink: true }}/>
    </div>
  );
}

Material - UI TextField değişken etiketi değerle çarpıyor

Soru

Uygulama.tsxname

paket.jsonname

En iyi cevabı

Diğer dillerde

Bu sayfa diğer dillerde

Bu kategoride popüler

Popüler soruları bu kategoride