Question

我正在尝试创建一个功能性登录组件。当我评论 onChange 时，我在浏览器中收到以下错误

index.js:1 Warning: You provided a `value` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultValue`. Otherwise, set either `onChange` or `readOnly`.

<块引用>

如果我取消对 onChange 的注释并尝试用户名字段，我会得到以下错误 Login.js:20 Uncaught TypeError: Cannot read property 未定义的“inputChangedHandler” 在 onChange (Login.js:20)

如何解决？ import React, { useState, props } from 'react';

const Login = (prop) => {

    const [username] = useState('Mr x');


    const inputChangedHandler = (event) => {
        const updatedKeyword = event.target.value;
        // May be call for search result
    }


    return (
        <div>
            <h1>Login</h1>
            <div className="container">

                User Name: <input type="text" name="username" value={username}
                  //  onChange={(event) => this.inputChangedHandler(event)}
                     />

                    Password: <input type="password" name="password" />
                <button className="btn btn-success"  >Login</button>
            </div>
        </div>
    )
}


export default Login;

Answer 1

您需要从 Route::group(['middleware' => ['auth', 'roles:0'], 'prefix' => 'live'], function () { Route::get('/dashboard', [DashboardController::class, 'index'])->name('user.dashboard'); 中删除 namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Foundation\Auth\User as Authenticatable; use Illuminate\Notifications\Notifiable; use Laravel\Fortify\TwoFactorAuthenticatable; class User extends Authenticatable { use Notifiable; use TwoFactorAuthenticatable;

要实际更改值，您需要像这样向 this 添加一个 setter this.inputChangedHandler(event)

然后像这样使用它useState

React js 在功能组件中设置状态

1 个答案: