본문 바로가기

JavaScript27

[quasar] quasar의 input 컴포넌트 Quasar는 Vue기반 프레임워크입니다. 쉽고 빠른 프론트엔드 개발을 위해 미리 갖추어진게 많은 프레임워크인데 저는 회사에서 프론트엔드 개발을 Quasar를 이용해 진행하고 있습니다. 프론트엔드 개발을 하면 form 양식을 만들어야할 때가 굉장히 많은데요. form요소들은 만들 때 고려해야할 몇가지 까다로운 것들이 있습니다. 사용자에게 받아와야할 데이터의 종류에 따라 form의 형태, 플레이스홀더, 유효성 검증등을 그때마다 다르게 해야하는데 Quasar의 input 요소를 이용하면 매우 쉽고 빠르게 form요소 작성이 가능합니다. 1. Input의 스타일 Outline, filled 등 다양한 스타일을 적용할 수 있고 icon옵션을 사용하면 구글 material icon에 있는 icon을 적용할 수 있.. 2021. 4. 20.
Javascript 디자인패턴 - 1. Callback 패턴 Callback 패턴 콜백은 나중에 실행할 부차 함수에 인자로 넣어지는 함수입니다. 자바스크립트에서 함수는 일급 객체로 여겨지기 때문에 함수도 다른 함수에 인자로 전달할 수 있습니다. 여기서 콜백이 실행될 나중 시점이 부차 함수의 실행 완료 이전이면 전부 동기 콜백이지만, 비동기 콜백도 적용기법은 같습니다. 프로미스는 비동기 콜백에서만 사용됩니다. 콜백 패턴은 자바스크립트에서 정말 중요한 패턴입니다. function getResult(callback) { console.log("result"); callback(); //인자로 넘겨받은 add() 함수가 실행된다. } //인자로 넣어지는 콜백함수 function add(a, b) { return a + b; } 콜백 패턴을 테스트할 때 확인해야 할 점으로.. 2021. 4. 14.
JS | 동적으로 추가된 HTML element 제어하기 동적으로 추가된 HTML 요소들은, 즉 jquery나 JS를 통해 추가된 요소들은 다른 요소들처럼 기존의 방식대로 이벤트가 등록되고 제어되지 않는다! 참고: https://uiandwe.tistory.com/1107 https://m.blog.naver.com/PostView.nhn?blogId=nemesis5198&logNo=221362855998&proxyReferer=https%3A%2F%2Fwww.google.com%2F 2020. 2. 11.