vue에서 카카오맵 API 사용하기

1. <template>안에 <vue-daum-map> 태그를 사용한다.

<template>    
    <vue-daum-map
        :appKey="appkey"
        :center.sync="center"
        :level.sync="level"
        :mapTypeId="mapTypeId"
        :libraries="libraries"
        @load="onLoad"
        style="width:100%;height:100vh;position: fixed;"
    >
    </vue-daum-map>
</template>

2. Kakao Developers에 접속하여 로그인하고 아래 화면에서 '내 애플리케이션'을 클릭한다.

3. 애플리케이션을 추가하고 Web플랫폼을 사용한 후 앱 키(javascript key)를 발급 받는다.

4. data()에 다음과 같이 추가해준다.

data() {
  return {
    appkey: '발급받은 javascript 키',
    center: {lat: 37.5411, lng: 127.068},
    level: 3,
    mapTypeId: VueDaumMap.MapTypeId.NORMAL,
    libraries: ['사용할 라이브러리'],
    }
}