我有以下代碼,我在其中創建了一個簡單的登錄表單,一切正常,直到我嘗試在表單輸入中鍵入內容為止,似乎我無法在表單欄位中鍵入內容。以下是我的代碼。我不得不提一下,我還沒有呼叫任何服務器 api。
<template>
<el-row justify="center">
<el-col :span="6" >
<el-card shadow="always">
<template #header>
<span>Memeber Login</span>
</template>
<div >
<el-form ref="user" :model="user">
<el-form-item>
<el-input
v-model="user.email"
placeholder="Email Address"
clearable
prefix-icon="message">
</el-input>
</el-form-item>
<el-form-item>
<el-input
v-model="user.password"
placeholder="Password"
clearable show-password
prefix-icon="lock"
>
</el-input>
</el-form-item>
<el-form-item>
<el-button type="primary">
<el-icon><check /></el-icon> Login
</el-button>
</el-form-item>
</el-form>
</div>
</el-card>
</el-col>
</el-row>
</template>
<script lang="js">
import { reactive } from 'vue';
export default {
setup() {
const user = reactive({
email: '',
password: '',
});
return {
user,
};
},
};
</script>
編輯:這是影像。
圖片鏈接
uj5u.com熱心網友回復:
el-form上的屬性ref="user"與回應式用戶密鑰沖突,只需使用其他詞,如ref="userForm" 參見此處
uj5u.com熱心網友回復:
為該<script>部分嘗試以下替代方案:
<script lang="js">
export default {
name: "LoginForm",
data() {
return {
user: {
email: '',
password: ''
}
}
};
</script>
LoginForm您的組件名稱在哪里。
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/370459.html
