要素フォームに情報が自動的に入力されます

初回入力時は自動で情報が入力されます

 要素内の入力ボックスには読み取り専用のプロパティがあります

入力ボックスに読み取り専用属性を追加し、フォーカスを取得してから変数をバインドします。

<div class="form">
    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="demo-ruleForm">
        <el-form-item label="电子邮件地址" prop="email">
            <el-input :readonly="readonlyData" @focus=focusFn v-model="ruleForm.email"/>
        </el-form-item>
        <el-form-item label="密码" prop="password">
            <el-input :readonly="readonlyData" @focus=focusFn type="password" v-model="ruleForm.password"/>
        </el-form-item>
    </el-form>
</div>

この変数を定義します。その機能は、読み取り専用属性が true か false かを判断することです。 

let readonlyData = ref(true)

入力ボックスがフォーカスを取得したときのハンドラー関数を定義します。

この関数の機能は、入力ボックスがフォーカスを取得したときに読み取り専用属性を削除することです。

function focusFn() {
    readonlyData.value = false
}