[Web] (49) 썸네일형 리스트형 [Web] Node.js / mysql limit 사용 시 변수 사용하기 [페이징 시 사용] const start_page_number = 0; // 시작하는 페이지 const end_page_number = 0; // [가져올 페이지 총 수] const row = await pool.query('select * from test_table ORDER BY number ASC LIMIT ?, ?',[Number(start_page_number),Number(end_page_number)]); limit 사용 시, 변수를 사용하고 싶은 경우에 위와 같이 사용하면 된다. 주로 페이징을 요할 때 사용하면 좋다. [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: .. [Web] Vue router-link 사용 시, 이동이 제대로 되지 않을 때 Vue router-link를 사용할 때, /directory/A /directory/B 로 지정하고, router-link를 통해 이동하고자 할 때, 제대로 이동이 되지 않는 경우가 있다. 같은 디렉토리에서 이동하고자 할 때, 이동이 원활하지 않는 경우, 다음을 추가해준다. 다음과 같이 :ket="$route.fullPath"를 지정해주면 된다. 자세한 설명이 필요하다면 아래 링크를 통해 확인하면 된다. https://hj-tilblog.tistory.com/99 Vue router view :key="$route.fullPath" Router - view의 기능을 새로 발견했다🧐 새로 알게된 기능을 기록하려고 한다. 막 엄청난 내용이 아니긴한데 그래도 기록해놓으면 오래 기억할 수 있으니깐! vue는 .. [Vue] router-link 하이퍼링크 밑줄, 클릭 색상 변경 제거 Vue router-link 사용 시, 밑줄이 생기는 문제 및 클릭 시 색상이 변경되는 문제가 있다. 해당 문제는 다음과 같이 해결이 가능하다. css 즉 코드 쪽에 아래와 같이 추가해준다. Vue 에서 router-link는 a 태크로 취급하므로, a 태그에 다음과 같이 해주면 된다. 혹 개별로 적용이 필요하다면, 따로따로 해줘야 할 것이다. a{text-decoration:none; color: white} [Vue] 스크롤 바 숨기기 #side {-ms-overflow-style: none; /* IE and Edge */scrollbar-width: none; /* Firefox */} #side::-webkit-scrollbar {display: none; /* Chrome, Safari, Opera*/} 이중 스크롤 표시 등으로 보기에 불편할 때 다음과 같은 코드를 이용해 스크롤 기능은 유지한 채, 스크롤바를 안보이게 처리할 수 있다. [Web] Vue 화면 새로 고침 this.$router.go(); Vue 화면 새로고침 [Web] 이미지 혹은 텍스트 등에 마우스 커서 효과 넣어주기 웹 개발 시, 이미지나 텍스트 등에도 버튼과 같이 마우스 올리면 버튼처럼 보이게 하는 효과 넣어주기 style="cursor:pointer;" 다음과 같이 커서 효과를 넣어주면 된다. [Web] app.vue 실행 시, 여백 제거하기 app.vue를 통해 화면을 처음 띄울 경우 상하좌우에 8px의 여백이 있다. body{ margin: 0px} 을 넣어주면 없어진다. 이전 1 2 3 4 5 6 7 다음