محمد کاظمی
3 سال پیش توسط محمد کاظمی مطرح شد
9 پاسخ

در Vue.js با دستور v-select مقادیر یک آرایه رو چطور نشون بدم

من یک سری از خصوصیات محصول رو توی یک فیلد به اسم featurs توی دیتابیس ذخیره کردم.
اینجوری:

{"weight":[2,12],"material":[{"name":"موز","price":"1000"},{"name":"گردو","price":"1000"},{"name":"کرم فیل","price":"1000"},{"name":"توت فرنگی","price":"1000"},{"name":"شکلات چیپسی","price":"1000"}],"creamTaste":[{"name":"هل","price":"1000"},{"name":"ساده","price":"1000"},{"name":"قهوه","price":"1000"},{"name":"گلاب","price":"1000"},{"name":"نسکافه","price":"1000"}],"spongeTaste":[{"name":"وانیل","price":"1000"},{"name":"کاکائو","price":"1000"},{"name":"شکلات","price":"1000"}],"defaultMat":["موز","گردو","کرم فیل","توت فرنگی","شکلات چیپسی"],"gol":"1000","toper":"1000","picOnCake":"100000","picOfUser":"100000","extra":false}

زمانی که کاربر توی سایت روی محصول کلیک میکنه و مثلا میخاد برخی از این خصوصیات رو به همراه محصول سفارش بده.
الان میخوام با دستور v-select مقادیر نام این آرایه رو بصورت هر کدوم یک آیتم بهم برگردونه... اینجوری:

  1. موز
  2. گردو
  3. کرم فیل و....
    ولی الان توی v-select به من فقط یک آیتم نشون میده که اسمش برابر اسم کل آرایه هستش...
    چه کنم اساتید...؟

ثبت پرسش جدید
محمد کاظمی
تخصص : مدیر توسعه فناوری اطلاعات و آی...
@kazemi.muhammad 3 سال پیش مطرح شد
میلاد-م
تخصص : توسعه‌دهنده رابط کاربری - Fron...
@milad 3 سال پیش مطرح شد
0

از directive-دستورالعمل v-for استفاده کنید.
https://v3.vuejs.org/guide/list.html#list-rendering


محمد کاظمی
تخصص : مدیر توسعه فناوری اطلاعات و آی...
@kazemi.muhammad 3 سال پیش مطرح شد
0

ببین توی کنسول این خطا رو میزنه


[Vue warn]: Invalid prop: type check failed for prop "items". Expected Array, got String with value "{"weight":[2,12],"material":[{"name":"موز","price":"1000"},{"name":"گردو","price":"1000"},{"name":"کرم فیل","price":"1000"},{"name":"توت فرنگی","price":"1000"},{"name":"شکلات چیپسی","price":"1000"}],"creamTaste":[{"name":"هل","price":"1000"},{"name":"ساده","price":"1000"},{"name":"قهوه","price":"1000"},{"name":"گلاب","price":"1000"},{"name":"نسکافه","price":"1000"}],"spongeTaste":[{"name":"وانیل","price":"1000"},{"name":"کاکائو","price":"1000"},{"name":"شکلات","price":"1000"}],"defaultMat":["موز","گردو","کرم فیل","توت فرنگی","شکلات چیپسی"],"gol":"1000","toper":"1000","picOnCake":"100000","picOfUser":"100000","extra":false}".

فکر کنم میگه دارم متغیر آرایه رو بشکل استرینگ نمایش میدم...
درسته...؟
با v-for هم امتحان کردم... آرایه رو پیمایش نمیکنه


میلاد-م
تخصص : توسعه‌دهنده رابط کاربری - Fron...
@milad 3 سال پیش مطرح شد
0

کدهاتون رو یادتون رفتش قرار بدین.
اگر پیمایش نمی کنه، یعنی خطا از کدنویسی هستش.
این نمونه تون رو هم درست قرار بدین، اینطوری نمیشه متوجه شدش چجوری شی و آرایه باز و بسته میشه.


محمد کاظمی
تخصص : مدیر توسعه فناوری اطلاعات و آی...
@kazemi.muhammad 3 سال پیش مطرح شد
0

ببین توی دیتابیس من بصورت
JSON.stringify(product.features)
ذخیره میکنم.
به این شکلتوضیح تصویر رو وارد کنید


محمد کاظمی
تخصص : مدیر توسعه فناوری اطلاعات و آی...
@kazemi.muhammad 3 سال پیش مطرح شد
0

توی VueJS کد هام اینجوریهبا متد getProduct توی اون متغیر this.productDetails تمام خصوصیتهای محصول رو دارم که features هم جزئشون هست. ولی از features به بعد رو نمیتونم صدا بزنم. میتونم دونه دونه کاراکترهاشو بگیرم و یا کلی ولی پیمایش نمیشه یا من بلد نیستم.


محمد کاظمی
تخصص : مدیر توسعه فناوری اطلاعات و آی...
@kazemi.muhammad 3 سال پیش مطرح شد
محمد کاظمی
تخصص : مدیر توسعه فناوری اطلاعات و آی...
@kazemi.muhammad 3 سال پیش مطرح شد
0

اینم خطای توی کنسول

vue.runtime.esm.js?2b0e:619 [Vue warn]: Invalid prop: type check failed for prop "items". Expected Array, got String with value "{"weight":[3,12],"material":[{"name":"موز","price":"1000"},{"name":"گردو","price":"1000"},{"name":"کرم فیل","price":"1000"},{"name":"توت فرنگی","price":"1000"},{"name":"شکلات چیپسی","price":"1000"}],"creamTaste":[{"name":"هل","price":"1000"},{"name":"ساده","price":"1000"},{"name":"قهوه","price":"1000"},{"name":"نسکافه","price":"1000"},{"name":"گلاب","price":"1000"},{"name":"شکلاتی","price":"1000"}],"spongeTaste":[{"name":"وانیل","price":"1000"},{"name":"کاکائو","price":"1000"},{"name":"شکلات","price":"1000"},{"name":"ردولوت","price":"1000"}],"deliverTime":"2","defaultMat":[],"gol":"1000","toper":"1000","picOnCake":"1000","picOfUser":"1000","extra":{"optName":"1000","price":"1000"}}".

found in

---> <VSelect>
       <AppProductDetails>
         <VTabItem>
           <VTabsItems>
             <VTabs>
               <Anonymous>
                 <VContent>
                   <VApp>
                     <App> at src/App.vue
                       <Root>

میلاد-م
تخصص : توسعه‌دهنده رابط کاربری - Fron...
@milad 3 سال پیش آپدیت شد
0

برای مقداردهی items، اون this رو قبل از productDetails.features چرا نوشتین؟ کلمه this رو حذف کنید.
خطایی که میده واضح هستش، میگه مقدار ورودی برای items باید یک آرایه باشه.

خود productDetails.features که آرایه نیستش، به آرایه تبدیلش کنید.


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام