vue 페이지 이동시 input 창 자동 포커스

LoginForm.vue

		<form @submit.prevent="submitForm">
			<div>
				<label for="username">username</label>
				<input type="text" id="username" v-model="username" ref="cursor" />
			</div>
			<div>
				<label for="password">password</label>
				<input type="text" id="password" v-model="password" />
			</div>
			<button type="submit">로그인하기</button>
			<p>{{ message }}</p>
		</form>

<script>
	mounted() {
		this.startCursor();
	},
    methods:{
	    startCursor() {
			this.$refs.cursor.focus();
		},
    }
</script>

 

포커스로 이동하는 함수실행을 이유는 모르지만

created훅에 넣으면 에러가 발생

mounted 안에서는 제대로 작동됨을 확인했다.