본문 바로가기

[Web]/Vue

[Web] Vue 게시판[테이블] 쉽게 만들기 - vue-good-table 활용하기

반응형

Vue를 활용해 게시판을 만들 경우 손 쉽게 만들 수 있는 방법을 소개한다.

 

vue-good-table 을 활용하는 것인데, 테마 및 여러 옵션을 제공하므로 사용에 있어 매우 편리하게 되어 있다.

 

Vue 2 버전과 Vue 3버전이 다르므로, 이점 참고해서 자신에게 맞는 버전을 적용해서 쓰길 권장한다.

 

 

Vue 3 버전

 

https://borisflesch.github.io/vue-good-table-next/guide/#installation

 

Getting Started | vue-good-table-next

Getting Started Installation Install with npm: npm install --save vue-good-table-next 1 Import globally in app: import VueGoodTablePlugin from 'vue-good-table-next'; import 'vue-good-table-next/dist/vue-good-table-next.css' Vue.use(VueGoodTablePlugin); 1 2

borisflesch.github.io

 

Vue 2 버전

https://xaksis.github.io/vue-good-table/

 

vue-good-table

 

xaksis.github.io

 

Tip 모듈을 사용하고자 할 때, 가끔식 제대로 설치 및 import 해주었는데도 안되는 경우가 있다.

이 경우 Vue2 버전과 Vue3 버전에서의 차이로 인해 발생하는 문제 일 수 있으니, 해당 부분을 확인해야 한다.

 

보통 Vue2 버전인 경우 해당 모듈 뒤에 -next라는 이름으로 많이 되어 있는 경우가 많으므로 혹시 자신이 사용하고 있는 모듈이 안되는 경우 뒤에 next를 붙여 검색해보면 다른 버전이 있을 수 있다.

 

ex) Vue 2 버전  vue-good-table

     Vu2 3 버전  vue-good-table-next

반응형