telegram

توضیحات

در این جلسه به توضیح نحوه استفاده از selectbox در form(فرم) در vue.js (ویو جی اس) می پردازیم.

javascript جاوا اسکریپت vuejs ویو جی اس

برای دانلود ابتدا وارد سایت شوید

مدرس دوره علی شیخ
مدت دوره 11:05:31
تعداد ویدیو 69
وضعیت دوره : کامل شده
قیمت دوره : رایگان
برای دانلود ابتدا وارد سایت شوید
دسته بندی دوره ها
HTML CSS طراحی وب FlexBox Bootstrap فریمورک طراحی سایت جاوا اسکریپت اکما اسکریپت پی اچ پی php mysql javascript jquery oop mvc composer laravel emmet npm nodejs webpack vuejs livewire vuex API وب سرویس alpinejs tailwindcss react git github typescript next.js nest.js nuxt.js sass ساس

دوره های پشنهادی

دوره های آموزشی
آموزش npm
کامل شده
% 10 تخفیف

آموزش npm

NPM مخفف Node Package Manager و در واقع Package Manager ایست که برای Node.js و یا بهتر بگیم دنیای برنامه نویسی جاوااسکری...

119,000 107,000 تومان
02:04:50
آموزش آلپاین (alpine.js) پروژه محور
کامل شده
% 5 تخفیف

آموزش آلپاین (alpine.js) پروژه محور

alpine.js یک فریمورک جاوااسکریپت است که میتواند جایگزین بسیار مناسب برای جی کوئری باشد. alpine.js به صورت رسمی برای فریم...

349,000 331,000 تومان
06:52:21
آموزش HTML5 & CSS3 پروژه محور
کامل شده

آموزش HTML5 & CSS3 پروژه محور

برای اینکه وارد دنیای طراحی وب شوید اولین چیزی که باید با آن آشنا شوید HTML است، HTML یک زبانه نشانگذاری برای ایجاد وبسا...

رایگان
04:51:23
آموزش رایگان flexbox (فلکس باکس) پروژه محور
کامل شده

آموزش رایگان flexbox (فلکس باکس) پروژه محور

در دنیای HTML و CSS که نمایش محتوا را به عهده دارند همیشه یک موضوع، سختی و پیچیدگی خاص خود را داشته و آن هم صفحه آرایی ا...

رایگان
04:32:18
مشاهده تمام دوره های آموزشی

نظرات ارزشمند شما:

برای ارسال نظر ابتدا باید وارد سایت شوید

  • Davood Noruzy

    با سلام و احترام
    با توجه به کدهای ارسالی ،در فایل main.js ، چرا مقدار lang حتما باید یکی از مقدار آرایه langs باشد ؟ ارتیاط این دو تا رو متوجه نمیشم .
    من یک مقدار خارج از مقادیر آرایه langs را برای مقدار lang قرار دادم ، اصلا نشناخت. برای همین میگه که با هم در ارتباط هستند . حالا چطوری در ارتباط هستند رو ممنون میشم توضیح بدبد.
    کد HTML : 

    

     <div id="app">

          <form action="">

            <label for="language">Select lang:</label>

    

            <select v-model="formData.lang">

              <option v-for="(lang,index)  in langs " :key="index">{{lang}}    </option>

            </select>

            <hr />

            <button @click.prevent="show" type="submit">Submit</button>

          </form>

        </div>

    کد Vue : 
    

    Vue.createApp({

      data() {

        return {

          langs: ["c", "php", "js"],

          formData: {

            lang: "c",

          },

        };

      },

    

      methods: {

        show() {

          console.log(this.formData);

        },

      },

    }).mount("#app");

    • علی شیخ

      1 سال پیش

      سلام وقت بخیر.
      بخاطر اینکه شما توی option حلقه زدید بر اساس دیتاهای متغیر langs و از طرفی گفتیم که مقداری که انتخاب میشه داخل متغیر lang قرار بگیره با v-model که اسم این متغیر میتونه هر اسم دیگه ای باشه
      حالا اگه قصد دارید option ای بصورت پیش فرض انتخاب باشه باید یکی از دیتاهای متغیر langs باشه