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

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

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

فصل پیوست ۳: آشنایی با Validatorهای عددی

با سلام! در جلسه ی قبل در مورد ارائه ی فیدبک صحیح به کاربر از طریق UI برنامه صحبت کردیم و در این جلسه می خواهیم با validator های بیشتری آشنا شویم اما قبل از آن باید نکته ای را گوشزد کنم. پس از مطالعه ی جلسه ی قبل ممکن است بگویید ما از همان ابتدای تایپ، ایمیل را خطا می گیریم که از نظر UX اصلا مناسب نیست. یعنی به محض شروع به تایپ کردن، فیلد قرمز می شود بنابراین راه حل چیست؟ اگر یادتان باشد ما برای صدا زدن متد touch$ از رویداد input@ استفاده کرده بودیم اما استفاده از آن الزامی نیست بلکه می توانیم از هر رویداد دیگری مانند blur@ استفاده کنیم. این رویداد که مربوط به Vue.js است و به پکیج vulidate ربطی ندارد، زمانی اجرا می شود که input ما focus خود را از دست بدهید (زمانی که کاربر درون فیلد در حال تایپ است اما با کلیک در خارج از فیلد، از آن خارج می شود – باید با مبحث focus که از مفاهیم ابتدایی زبان CSS است آشنا باشید). بنابراین. حالا فقط زمانی هشدار ها را نمایش می دهیم که Focus از بین برود. می توانید این کد را در مرورگر خودتان تست کنید. در نهایت به یاد داشته باشید که همه چیز بستگی به این دارد که چه زمانی touch$ را صدا بزنید. یعنی حتی ممکن است نخواهید از رویداد ها استفاده کنید بلکه یک دکمه (button) ساده را قرار بدهید که هنگام کلیک شدن، متد touch$ را اجرا کند. بنابراین زمانی که به نظر شما زمان مناسبی برای اعتبارسنجی یک فیلد است، باید touch$ را صدا بزنید، حالا به هر شکلی که باشد. اما برویم سراغ validator ها …