85일차

• vue 프로젝트에 필요한 배경지식 및 자료 정리

새로배운 내용

1. slot과 props를 이용한 버튼 스타일 지정

2. input[type="number"] value의 타입비교

<div class="form-control">
  <label for="age">Your Age (Years)</label>
  <input id="age" name="age" type="number" v-model="userAge" ref="ageInput" />
</div>

data() {
  return {
    userAge: null
  }
},
methods: {
    submitForm() {
      console.log('this.userAge: ', typeof this.userAge)  //number
      console.log('this.$refs.ageInput.value: ', typeof this.$refs.ageInput.value) //string
    }  
}

axios와 fetch

fetch('https://vue-http-demo-85e9e.firebaseio.com/surveys.json', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    name: this.enteredName,
    rating: this.chosenRating,
  }),
});

import axios from 'axios'; // at the start of your <script> tag, before you "export default ..."
...
axios.post('https://vue-http-demo-85e9e.firebaseio.com/surveys.json', {
  name: this.enteredName,
  rating: this.chosenRating,
});

isLoading