728x90 반응형 Vue7 [JavaScript] 생년월일 데이터 포맷 개발 환경 --------------------------------- OS : Mac 개발 툴 : intelliJ 개발 언어 : javaScript 개발 프레임워크 : nuxt 빌드 도구 : Gradle --------------------------------- 회원가입 등 생일 데이터를 받아야할 때 사용자가 주는 데이터를 포맷하서 넣어주면 깔끔하다. 잘못된 데이터가 들어가는 일도 없을 것이다. 아래 코드는 생일 데이터를 입력받을 때 내가 받고싶은 데이터 형식에 맞게 포맷해주는 코드이다. 1. 숫자 외의 문자는 받지 않는다. 2. 8자 이상 넘어가지 않도록한다. 3. 현재 년도를 넘어가지 않게하며 1~12월, 1~31일 안에서 입력될 수 있도록 한다. 내가 설정한 조건은 위 세가지이다. const i.. 2024. 4. 4. [Vue.js] NextTick 개발 환경 --------------------------------- OS : Mac 개발 툴 : intelliJ 개발 언어 : java 프레임워크 : nuxt.js --------------------------------- DOM(웹 페이지)에서 데이터가 업데이트 되어 페이지가 렌더링되거나 UI가 변경될 때 즉, DOM에 접근하는 작업을 하는 경우 Vue가 다시 DOM을 바로 인식하지 못하는 경우가 있습니다. 이런 경우 자바스크립트의 비동기 특성으로 오류가 발생합니다. nextTick 메서드는 DOM을 다시 인식하기까지 기다려줍니다. 모든 데이터의 업데이트 및 화면 렌더링을 마친 후 DOM에 다시 접근합니다. 아래는 nextTick 사용 예시입니다. const nextTickTest = async .. 2024. 2. 2. [Nuxt.js] 프로젝트 생성하기 개발 환경 --------------------------------- OS : Mac 개발 툴 : intelliJ 개발 언어 : java 개발 프레임워크 : nuxt 빌드 도구 : Gradle --------------------------------- Nuxtjs = Vue + SSR 라고 간단하게 이해한 후 시작해보자 SSR은 server side rendering의 약자로 클라이언트가 서버에 매번 데이터를 요청하고 서버에서 처리하는 방식이다. 예를들어 원래는 특정 url을 호출하면 클라이언트단(브라우저)에서 화면을 그린다. 2023. 10. 30. [vue3] Cannot start service: Host version 오류 개발 환경 --------------------------------- OS : Mac 개발 툴 : intelliJ 개발 언어 : java 개발 프레임워크 : vue3 빌드 도구 : Gradle --------------------------------- vue 프로젝트를 실행했는데 local 실행이 정상적으로 되지 않는다. 아래와 같이 에러가 떴다... 호스트 버전이 바이너리 버전과 안맞는다?? 라고 한다. Cannot start service: Host version "0.18.20" does not match binary version "0.17.19" 아직 원인은 찾지 못했지만 해결방법은 프로젝트 폴더 구조에 있는 node modules 폴더를 삭제한 후 yarn install을 실행한다. 이렇게.. 2023. 9. 27. vue-cli-service: command not found Error 잡기 안녕하세요 전진시입니다 이번 포스팅은 제가 뷰 실습하면서 하루에 한번은 만나는것 같은 sh: vue-cli-service: command not found 이자식 rm -rf node_modules npm install npm을 다시 설치해줍시다 ! 2022. 5. 17. Vue.js v-for를 이용한 리스트 렌더링 안녕하세요 전진시입니다 지난 포스팅 vue 셋팅에 이어 가보겠습니다 vue는 생각보다 문법이 직관적이고 쉽다고 느껴지네요 v-for 구문은 v-for = "item in array" 이렇게 생겼습니다 item은 array가 반복되면서 불러올 요소 하나하나를 가리킵니다. item은 아무 이름이나 넣어줘도 됩니다. 테스트 데이터를 만들어보자 data 속성에 titleArray를 정의해줍시다 titleArray는 4개의 요소로 이루어진 배열임! data() { return { titleArray : ['음식','일상','여행','가족'], } }, 테스트 데이터를 만들었으니 바로 v-for 구문을 완성해보겠습니다 엇 위에서 제가 말한 구문과 다릅니다! !!중요중요 (슬기와 배배!!!!!!!!!!!!!!!!!!.. 2022. 5. 8. Vue.js mac에서 개발환경 셋팅하기 [1] 안녕하세요 전진시입니당 오늘은 Vue를 셋팅해보겠슴다! 첫번째 . Node js를 설치합니다 https://nodejs.org/en/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 아래와 같은 화면이 뜨면 왼쪽 버튼을 눌러서 다운로드 ! node js를 설치하면서 두번째. vscode를 설치해주세요! https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging .. 2022. 5. 1. 이전 1 다음 728x90 반응형
