لدي مشكلة في التعامل مع input في react

Rayden Storm · 25 فبراير 2021

import React, { useState, useEffect } from 'react';

export default function Login() {
  const [name, setName] = useState();
  useEffect(() => {
    console.log(name);
  }, []);

  return (
    <div>
      <input type="text" value={name} onChange={(e) => setName(e.target.value)} />
    </div>
  );
}

يحدث معي هذا الخطا

warning:A component is changing an uncontrolled input of type undefined

Salah Eddin Beriani2 · 25 فبراير 2021

في react هنا نوعين من ال input نوع يتحكم فيه المتصفح ويسمى uncontrolled ونوع تتحكم فيه انت يدويا عن طريق الكود الذي تكتبه وهذا يسمى controlled ولا يمكننا استخدام الحالتين معا وفي حالتك انت تحاول استخدامهم معا حيث انه المكون كان يتوقع منك ان تعطي قيمة اولية لل input لكن عوضا عن ذلك انت تعطيه قيمة ال name وهو undefined في حالتك ويمكنك اصلاح هذا فقط باعطاء قيمة اولية ل name و string فارغ يكفي ليجعلك تتحكم في ال input

import React, { useState, useEffect } from 'react';

export default function Login() {
  const [name, setName] = useState("");
  useEffect(() => {
    console.log(name);
  }, []);

  return (
    <div>
      <input type="text" value={name} onChange={(e) => setName(e.target.value)} />
    </div>
  );
}

لدي مشكلة في التعامل مع input في react

السؤال

Rayden Storm

رابط هذا التعليق

شارك على الشبكات الإجتماعية

1 جواب على هذا السؤال

Recommended Posts

Salah Eddin Beriani2

رابط هذا التعليق

شارك على الشبكات الإجتماعية

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية