2022-08-22(월) TIL

오늘해야할일들

1. 알고리즘 2문제풀이

2. Nuxt 공식문서 공부

NuxtLink 구성요소

앱의 페이지 사이를 탐색하려면 구성 요소를 사용해야합니다.
NuxtLink 이 구성요소는 Nuxt 에 포함되어 있으므로 다른 구성 요소와 마찬가지로 가져올 필요가 없습니다.
href="/about"을 사용한다는 점을 제외하면 HTML a 태그와 유사합니다.
이전에 vue-router를 사용한 적이 있다면 대신 를 생각할 수 있습니다.

컴포넌트는 모든 내부 링크에 사용해야 합니다.
즉 사이트 내의 페이지에 대한 모든 링크에 대해 를 사용해야합니다.
a 태그는 모든 외부 링크에 사용해야합니다.
즉, 다른 웹사이트에 대한 링크가 있는 경우 해당 웹사이트에 a 태그를 사용해야 합니다.

예시 코드

<template>
	<div>
      <h1>Home Page</h1>
      <NuxtLink to="/about"
         >About (internal link that belongs to the Nuxt App)</NuxtLink>
      // Nuxt 앱에 속한 내부 링크 
      // 즉 a 태그 처럼 외부의 URL 이 아닌 내부 링크이다.
      <a href="https://nuxtjs.org">External Link to another page</a>
    </div>
</template>

Routing

대부분의 웹사이트에는 두 개 이상의 페이지가 있습니다.
이 페이지를 표시하려면 라우터가 필요합니다.
그것이 vue-router 입니다.
vue 애플리케이션으로 작업할 때 구성 파일(router.js)을 설정하고 모든 경로를 수동으로 추가해야 합니다.
Nuxt는 페이지 디렉토리에 제공된 vue 파일을 기반으로 자동으로 vue-router 구성을 생성합니다.
즉, 라우터 구성을 다시 작성할 필요가 없습니다.!
Nuxt는 또한 모든 경로에 대한 자동 코드 분할 기능을 제공합니다.

즉 , 애플리케이션에 라우팅을 사용하려면 페이지 폴더에 .vue 파일을 생성하기만 하면 됩니다.

알고리즘 문제풀이

조건 1 = 길이는 4 혹은 6이다.
조건 2 = 예를 들어 s가 'a234' 이면 False 를 리턴하고, "1234"라면 True를 리턴하면 됩니다.

[풀이 1번]
function solution(data) {
    if (data.length !== 6 && data.length !== 4) return false
    const result = data.split('').map((num)=> {
        if (isNaN(num)) return false
        return true
    }).includes(false) ? false : true
    return result
}

[삼항연산자 적용 풀이]
function solution(numbers) {
	let answer = 0;
    for (let i = 0; i < 10; i++) {
    	!numbers.includes(i) ? answer += i : ''
    }
}

[기본 풀이]
function solution(numbers) {
	let answer = 0;
    for (let i = 0; i < 10; i++) {
    	if (!numbers.includes(i)) {
        	answer += i
    	}else {
        	answer
        }
    return answer
}