رفتن به نوشته‌ها

دسته: Vue js (ویو جی اس)

فریم‌ورک‌های فراوانی برای توسعه‌دهندگان سمت کاربر (Front-End) وجود دارند که هریک بسته به نیاز و سبک کدنویسی، انتخاب می‌شوند. امروزه توسعه‌دهندگان به دنبال فریم‌ورک‌هایی هستند که علاوه بر قواعد ساختاری قدرتمند، روند آموزشی ساده‌ای داشته باشند. فریم‌ورک Vuejs (با تلفظ ویو‌جی‌اس) یکی از بهترین‌ها در نوع خودش است.

تکمیل کامپوننت Portfolio و نمایش سهام

در جلسه ی قبل موفق شدیم که getter ها را برای ماژول portfolio تعریف کنیم و منطق مورد نیاز دکمه ی Buy را نیز پیاده سازی کنیم اما فعلا هیچ چیزی را برای نمایش در portfolio نداریم. نکته ای را نیز باید به شما بگویم که ممکن است برایتان مشکل ایجاد کرده باشد. در حال حاضر اگر مرورگر را باز کرده و به صفحه ی stocks بروید (آدرس http://localhost:8080/stocks) باید بتوانید با تغییر مقدار سهام در input ها، روی Buy کلیک کنید. اگر پس از تغییر تعداد سهام از صفر به عددی صحیح مثل 5، دکمه ی buy همچنان غیر فعال باقی ماند باید کد ها را تغییر دهید. به فایل Stock.vue در پوشه ی stocks بروید و قسمت input را بدین شکل بنویسید. دلیل غیر فعال باقی ماندن Buy این است که ما گفته بودیم اگر مقدار input یک عدد صحیح باشد، دکمه ی Buy غیر فعال شود. از طرفی در برخی از سیستم ها مقداری که به input می دهیم به عدد تبدیل نمی شود و رشته می ماند بنابراین رشته ی “5” با عدد 5 یکی نیست و شرط برقرار نمی شود. برای حل این مشکل باید به v-model یک modifier اضافه کنیم (v-model.number) تا رشته به عدد تبدیل شود. توضیحات بیشتر در لینک زیر از documentation وب سایت Vue.js: