Vue.js / 3

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

- 뷰 라우터 임포트 하는 방법

import {createRouter, createWebHistory} from 'vue-router'

 

 

 

 

 

- 라우팅 하는 방법

import { createApp } from 'vue'
import App from './App.vue'
import {createRouter, createWebHistory} from 'vue-router'
import Index from './components/Index.vue'
import MenuList from './components/menu/List.vue'


//라우터 만들기
const router = createWebHistory({
    history: createWebHistory(),
    routes:[
        {path: '/',component: Index}, //인덱스가 하는것
        {path: '/menu/list',component:MenuList},
    ]
  })

createApp(App)
.use(router)
.mount('#app')

 

 

 

 

 

 

- router-link로 바꾸기

<router-link to="./menu/list" class="btn btn-default">주문하기</router-link>

 

 

 

 

 

- 소문자로 하면 너무 html 시멘틱 태그 같으니까 컴포넌트는 대문자로 쓰는게 구분하기 좋다(근데 또 쓰기는 소문자로 쓰시네????)

 <RouterLink class="icon icon-menu">메뉴</RouterLink>

 

 

 

 

 

const router = createRouter({
    history: createWebHistory(),
    routes : [
        {path:'/', component:Index},// 메인홈
        {path:'/menu', component:Layout, children:[
            
        ]},
        //children은 여러개를 가질수 있어서 배열로 표현하고, Layout의 모든것을 갖고있다
    ]
  })

 

 

 

 

 

 

const router = createRouter({
    history: createWebHistory(),
    routes : [
        {path:'/', component:Index},// 메인홈
        {path:'/menu', component:Layout, //처음로드될때 레이아웃
        children:[
            {path: 'list', component:MenuList}, //두번째로드될때 레이아웃
            {path: 'detail', component:MenuList}//세번째로드될때 레이아웃

        ]
    },
    ]
  })

 

 

 

 

 

 

 

 

- 둘다 같은 방식이다

{path:'/admin',component:Layout,
            children:[
                {path: 'index', component:AdminIndex},
                {path: 'menu/list',component:AdminMenuList}
            ]
        },

 

 

 

 

 

 

 

 

 

 

h2

 

h2 생성방법인가 이게뭔데

 

 

 

 

메모리에 데이터를 넣는 기능

 

 

 

 

 

 

 

뭐하는건지 모르겟다 진심

 

 

 

 

 

 

JDBC를 사용할수있는 Mapper Tool(My Batis)를 쓰다가
인터페이스에 있는 함수와 SQL문을 매핑시켜주면 그안에 있는 DAO를 쓸수 있게 되었다

* 맨 막 두줄은 앞으로 배울거인듯?