Vue js

[학습목표] 화면구성

로그인, 회원가입, 메인, 추가조회삭제수정

 

 

뷰 라우터 설치

$ npm i vue-router@3.5.3

 

 

 

 

 

 

 

 

 

 

<template>
  <form @submit.prevent="submitForm">
    <div>
      <label for="username">아이디: </label>
      <input id="username" v-model="username" type="text" />
    </div>
    <div>
      <label for="password">비밀번호: </label>
      <input id="password" v-model="password" type="text" />
    </div>
    <div>
      <label for="nickname">닉네임: </label>
      <input id="nickname" v-model="nickname" type="text" />
    </div>
    <button type="submit">로그인</button>
  </form>
</template>

<script>
export default {
  data() {
    return {
      username: '',
      password: '',
      nickname: '',
    };
  },
  methods: {
    submitForm() {
      console.log('폼입력했습니다.');
    },
  },
};
</script>

<style></style>