سعید محمدی
4 سال پیش
توسط سعید محمدی
مطرح شد
چطوری آبجکت تو در توی ویو جی اس رو در یک حلقه بخوانم
سلام خدمت دوستان عزیز
این متغیر تعریف شده در vue js هست
members : {
"elnaz":{"code":"100","city":"isfahan","job":"photographer"},
"ali":{"code":"200","city":"tehran","job":"programmer"},
"nima":{"code":"300","city":"shiaz","job":"doctor"},
"fatemeh":{"code":"400","city":"gilan","job":"accountant"},
"amir":{"code":"500","city":"tehran","job":"pilot"},
"sayeh":{"code":"600","city":"tabriz","job":"nurse"}
}و اینم کد html برای چاپ متغیر vujs بصورت loop
<select>
<option v-for="(value, key) in members" :value="key" :data-code="key.code" :data-city="key.city" >@{{ key.job }}</option>
</select>و میخام یه همچین نتیجه ای ازش تو خروجی ببینیم :
<select>
<option value="elnaz" data-code="100" data-city="isfahan" >photographer</option>
<option value="ali" data-code="200" data-city="tehran" >programmer</option>
<option value="nima" data-code="300" data-city="shiaz" >doctor</option>
<option value="fatemeh" data-code="400" data-city="gilan" >accountant</option>
<option value="amir" data-code="500" data-city="tehran" >pilot</option>
<option value="sayeh" data-code="600" data-city="tabriz" >nurse</option>
</select>ولی بجای خروجی بالا فقط مقدار مربوط به key رو میتونه بخونه در حالی که هیچ کدوم از موارد key.code یا key.city یا key.job رو نمیتونه بخونه ممنون میشم راهنماییم کنید
گزینش سوالات
گفت و گو های مرتبط
دسته بندی سوالات
تگ‌های محبوب
ثبت پرسش جدید
گزارش تخلف
کپی کردن
0
سلام توی جاوااسکریپت آبجکت مثل آرایه iterable یا قابلیت پیمایش و تکرار رو نداره و شما ابتدا باید آبجکت رو قابل iterable کنید. برای اینکار میتوانید از توابع entries یا values و یا keys استفاده کنید یا به آرایه تبدیل شوند. (اگه از توابع lodash برای اینکار استفاده کنید که چه بهتر)
بعد از اینکار شما باید به اینصورت کد خودتون رو تغییر بدید.
<select>
<option
v-for="(item, index) in Object.entries(members)"
:value="item[0]"
:data-code="item[1].code"
:data-city="item[1].city"
>
@{{ item[1].job }}
</option>
</select>