我的vue应用程序有问题。我创建了一个用户,然后我想更新他,我打开了更新表单,但字段是空的。我的v型是:用户名。当我将v-model更改为:bozpusers.username时,我已经用实际用户名预先填充了该字段,但当我将其发送到db a refresh时,所有内容都是空的。
我的代码在这里:
<template>
<v-card>
<v-card-title class="orange lighten-2 white--text">Upraviť používateľa: {{ bozpUsers.username }}</v-card-title>
<v-card-text>
<v-container>
<v-row>
<v-col cols="12">
<v-text-field color="orange lighten-2 white--text"
label="Používateľské meno"
required
v-model="username"
append-icon="mdi-account"
clearable
></v-text-field>
</v-col>
<v-col cols="12">
<v-text-field color="orange lighten-2 white--text"
label="Heslo"
type="password"
required
v-model="password"
append-icon="mdi-lock"
clearable
></v-text-field>
</v-col>
</v-row>
</v-container>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="orange lighten-2 white--text" @click="$emit('close-card')">
Zavrieť
<v-icon>mdi-close</v-icon>
</v-btn>
<v-btn
color="orange lighten-2 white--text"
@click="updateUser"
>
Uložiť
<v-icon>mdi-content-save</v-icon>
</v-btn>
</v-card-actions>
</v-card>
</template>
<script>
import UsersService from '@/services/UsersService';
export default {
props: ["bozpUsers"],
data: () => ({
id: "",
username: "",
password: "",
role: "user",
error: null,
}),
methods: {
async updateUser() {
this.error = null;
const bozpUpdatedUser = {
id: this.id,
username: this.username,
password: this.password,
role: this.role,
}
UsersService.put(this.bozpUsers.id, bozpUpdatedUser).then((response) => {
this.$emit("close-card");
})
.catch((error) => {
this.error = "Failed to submit data - please try again later.";
});
},
},
};
</script>
有什么解决办法吗?我可以预先填充字段吗?当我将数据发送到db时,它们实际上会保存吗?
暂无答案!
目前还没有任何答案,快来回答吧!