我正在尝试创建一个广告网站,用户在其中创建一个个人资料,其中包含其个人资料中的所有详细信息和图片,但要做到这一点,我需要将其存储在后端数据库的数组中,以便我以后可以检索它们。 这就是后端 javascript 的样子。
export const useProfileStore = defineStore('profile', { state: () => { return { firstName: "Ellen", lastName: "Hopegar", email: "me@luddb.com" } }, })
这就是我需要的数组的样子,只是其中存储了更多的输入。
const users = [ { firstname: "Fred", lastName: "Boy", email: "abc@t.com", }, { firstname: "Tom", lastName: "Boy", email: "abc@t.com", }, { firstname: "Jerry", lastName: "Boy", email: "abc@t.com", }, { firstname: "Sam", lastName: "Boy", email: "abc@t.com", }, { firstname: "Ben", lastName: "Boy", email: "abc@t.com", }]
我正在尝试制作它,以便我可以在 Vue.js 中使用它,就像这样的图标
<div v-for="user in users" :key="user.firstName" class="bg-slate-400 hover:bg-slate-800 w-64 p-4 rounded-xl shadow flex m-2 cursor-pointer"> <div class="w-10"> <img alt="Vue logo" src="../assets/logo.png" /> </div> <div class="ml-4"> <p class="font-bold">{{ user.firstname }} {{ user.lastName }}</p> <p class="-mt-1 text-xs">{{ user.email }}</p> </div> </div>
这里的输入来自不同的 vue.js
<form class="review-form" @submit.prevent="onSubmit"> <div id= "app"> <div> <input id="name" v-model="name" type="text" placeholder="Name"> <input id="email" v-model="email" type="text" placeholder="Email"> <input id="phone" v-model="phone" type="text" placeholder="Phone no."> <input id="age" v-model="age" type="text" placeholder="Age">
我也有文件输入需要存储在数组中,我希望这是有道理的,我只是不知道如何将输入存储到像我展示的那样的数组中,以便我能够在多个不同的页面上使用它当他们点击 onsubmit 按钮后创建配置文件时,需要将其放入一个数组中,抱歉,这太长了,任何帮助都将不胜感激,谢谢。
P粉9051445142024-03-30 13:49:22
我觉得你的元素数据应该生成为一个数组,而不是一个对象,这样你就可以在html页面方便的把这个数组,当你点击提交的时候,就可以将最新的数据插入到这个数组中,不应该吗是这样吗?