더 나은 웹개발을 꿈꾸는 기술 블로그. 웹이즈프리.
총 14개의 일치하는 문서를 찾았습니다.
- vuejs
[VueJS] scoped css를 이해하기 및 예제보기
VueJS에 CSS를 스타일을 적용하는 방법 중 편리한 Scoped CSS 기능에 대하여 알아보고 관련된 예제를 만들어 봅니다.! VueJS에서 Scoped CSS는?Vue를 사용하는 프로젝트는 다수의 컴포넌트를 사용하여 하나의 앱을 구현하게 됩니다. 이 경우 각각의 컴포넌트에 선언된 스타일이 의도하지 않거나 실수에 의하여 다른 컴포넌트에 영향을 줄 수 있겠죠. 이처럼 오직 특정 컴포넌트에만 고유의 스타일을 선언하기 위한 방법으로 vue-loader가 제공하는 scoped 방법을 사용할 수 있습니다.<style scoped>.my-component...
Last Modified : 2021-10-19 10:11:21
Created : 2021-10-19 10:10:00 - webdevetc
코드의 변수나 함수 등에 _ 언더바를 사용하는 이유는?
개발 언어의 클래스 및 함수를 보면 _ 언더바를 사용한 코드를 쉽게 볼 서 있습니다. 왜 이렇게 이름 앞에 _ 기호를 추가할까요? 그 이유 및 목적에 대하여 간단히 알아봅니다.가장 큰 목적은 스코프 구분에 따른 표시입니다. 개발언어는 해당 콘텍스트에 선언하여 사용되는 고유의 스코프영역(scope)을 가지고 있습니다. 스코프는 각각의 네임으로 참조할 수 있는 범위인데 이를 구분하기 위한 목적으로 언더바가 많이 사용됩니다. 예를들어 아래를 봐주세요.# 언더바 _ 기호를 사용한 변수 또는 함수, 메소드 사용 예제먼저 클래스를 선언하였고 내부에는 두개의 함수가 존재합니다.c...
Last Modified : 2017-11-06 12:19:36
Created : 2017-11-06 07:51:48 - js
자바스크립트 ES6 블록 스코프 함수 사용하는 방법
자바스크립트 ECMAScript 6에서 블록 스코프의 함수를 사용하는 방법입니다.자바스크립트의 변수가 ES6에서 let 또는 const 선언이 블록 스코프(Block scope)로 동작하는 것처럼 ES6에서는 함수 역시 {} 블록에서 블록 스코프를 사용할 수 있습니다.! 블록 스코프란?간단하게 블록 스코프는 선언된 블록 영역에서만 제한되어 접근 할 수 있음을 의미합니다. 즉 다른 스코프 영역인 블록을 벗어난 경우 해당 변수나 함수를 참조할 수 없게되는 것이죠. ES6 이전에는 블록스코프가 존재하지 않아 어려움이 많았으나 ES6부터는 가능해졌습니다.그럼 함수...
Last Modified : 2019-08-07 09:53:56
Created : 2017-08-10 03:33:44 - angularjs
AngularJS의 jqLite를 사용하여 scope내의 콘트롤러를 찾는 방법
AngularJS의 jqLite를 사용하여 scope내의 콘트롤러를 찾는 방법은 무엇일까요?먼저 원하는 컨트롤러가 사용된 엘리먼트를 찾습니다. 만약 아래와 같은 코드가 있다면..<div> <input id="myInput" ng-model="myCtrl.sitename='webisfree'" /></div>위와 같은 코드의 경우 아래 방법으로 찾을 수 있습니다.var myCtrl = angular.element('#myInput').scope().myCtrl;간단하게 해당 컨트롤러를 찾았습니다. 이제 myCtrl을 ...
Last Modified : 2017-08-11 01:40:41
Created : 2017-06-19 10:59:06 - angularjs
AngularJS 내부의 jqLite 메소드 scope() 알아보기
AngularJS 내부의 jqLite 메소드 scope()에 대하여 알아보겠습니다.# jqLite 내부의 scope() 메소드가 하는 일먼저 jqLite는 AngularJS 내부에서 사용되는 간단한 제이쿼리 엔진입니다. 제이쿼리의 일부 기능들이 동작하도록 만들어진 Minified 제이쿼리라고 보시면됩니다.? scope() 메소드jqLite는 제이쿼리와는 조금 다른 scope() 메소드를 가지는데 이는 특정 엘리먼트가 속해있는 스코프를 반환해줍니다. 반환된 스코프에 값, 모델을 추가, 변경함으로써 jqLite를 사용한 업데이트 변경사항을 AngularJS에서도...
Last Modified : 2017-08-11 01:41:07
Created : 2017-06-01 15:58:00 - etc
$scope.$apply() 사용시 $digest 에러가 발생하는 경우 해결방법
$scope.$apply() 사용시 $digest 에러가 발생할 수 있습니다. 해결 방법은 무엇일가요?원인은 $apply 또는 $digest가 이미 진행중(In progress)인 상태이기 때문입니다. 가장 간단한 방법으로 $setTimeout()을 사용합니다.$timeout(function() { // 실행할 코드를 추가})위에 코드를 추가하면 자동으로 $apply와 동일하게 반영됩니다....
Last Modified : 2017-05-23 18:24:59
Created : 2017-05-23 18:20:34 - etc
자바스크립트 고유의 유효범위 생성하는 방법
자바스크립트 고유의 유효범위 생성하는 방법...
Last Modified : 2017-05-15 11:23:42
Created : 2017-05-15 11:23:42 - angularjs
angularjs에서 scope watch 예제보기
AngularJS에서 사용할 수 있는 이벤트 방법 중 하나로 $scope의 $watch()를 사용할 수 있습니다. 아래는 $scope의 $watch()를 언제 어떻게 사용하는 예제와 함께 알아봅니다.# $scope의 $watch()는 무엇을 하는가?AngularJS에서 $scope.$watch는 어떤 기능을 수행할까요? 예를들어 스코프에 존재하는 변수 money가 존재한다고 가정합니다.(아래부터는 모델이라 부르겠습니다.) 이 money라는 값은 금액을 나타내는데 세 자리수마다 콤마를 사용하여 표기하고 싶습니다. 그래서 모델값이 정해지면 콤마를 추가하는 함수를 적용하였...
Last Modified : 2018-03-23 00:36:15
Created : 2017-03-30 08:31:26 - etc
자바스크립트에서 즉시호출함수를 사용하여 블록 스코프처럼 사용하기
자바스크립트는 C++ 또는 Java와 다르게 블록스코프가 존재하지 않습니다. 하지만 자바스크립트 역시 블록스코프가 있는 것처럼 사용할 수 있을까요?만약 IIFE, 즉시호출함수를 사용한다면 마치 블록스코프처럼 동작하게 하는 것이 가능합니다. 아래 예제를 봐주세요. # 자바스크립트 블록스코프처럼 동작하는 예제아래 예제를 봐주세요. 아래 예제는 블록스코프가 없는 일반적인 스크립트 코드입니다.test = function() { if (true) { var i=1; } // if 내부 블록에 변수 i를 선언 &n...
Last Modified : 2017-06-01 15:39:28
Created : 2017-03-23 18:35:31 - etc
자바스크립트에서 컨텍스트와 스코프의 개념은?
선언되는 범위를 기준으로 말할때 해당하는 컨텍스트가 기준이 되며 이 컨텍스트 안에서 선언되면 해당하는 스코프 체인이 생성되게 된다.참고로, 블록 스코프가 자바스크립트에서는 존재하지 않는다....
Last Modified : 2017-09-21 00:21:19
Created : 2017-03-22 18:07:09