타입스크립트 3

[Vue3] 자식컴포넌트 input value값 가져오기 (defineModel)

input 태그를 컴포넌트화하여 form 섹션 안에 포함시키려고 한다.각각의 input 컴포넌트 value값을 가져와서 부모 컴포넌트에서 사용하려면 어떻게 해야할까?  원래는 자식 컴포넌트에서 emit으로 value값을 부모한테 보내고 부모는 그 value값을 가져오는 과정을 거쳐야하지만,defineModel을 이용하면 다른 함수 없이 바로 value값을 가져올 수 있다. 자식 컴포넌트#inputText.vue  부모 컴포넌트  이렇게하면 부모 컴포넌트에 있는 변수 title에 InputText 컴포넌트에서 input 태그에 입력한 value값이 저장된다.  radio나 select input도 가져올 수 있다. input[type="radio"] # inputRadio.vue {..

Study/Vue3 2024.12.10

[타입스크립트] 초과 프로퍼티 오류를 방지하거나 검사를 우회하는 방법

1. 변수에 객체 리터럴을 할당한 후 사용하기객체 리터럴을 바로 사용하면 초과 프로퍼티 검사가 발생하지만, 먼저 변수를 정의한 후 타입을 할당하면 초과 프로퍼티 검사를 우회할 수 있습니다. let tempObject = { name: "바둑이", color: "brown", isBark: true, leg: 4, age: 5 // 초과 프로퍼티};let animalDog: Dog & Person = tempObject; // 오류 없음위의 경우 tempObject에 초과 프로퍼티가 있지만, 타입 할당 시에는 초과 프로퍼티 검사가 발생하지 않아서 오류가 발생하지 않습니다.2. 인덱스 시그니처(Index Signature) 사용인덱스 시그니처를 사용하면 초과 프로퍼티가 발생하지 않게 할 수 있습니다..

Study/Typescript 2024.10.09

[Typescript] 타입스크립트 기본 타입

기본 타입타입스크립트가 자체적으로 제공하는 타입원시타입(Primitive Type)- 하나의 값만 저장하는 타입 number//numberlet num1: number = 123;let num2: number = -123;let num3: number = 0.123;let num4: number = -0.123;let num5: number = Infinity;let num6: number = -Infinity;let num7: number = NaN;num1.toFixed(); //넘버타입의 메소드만 사용 가능 💡 이때 변수 뒤에 붙는 타입(:number)을  타입 주석 또는 타입 annotation 이라고 한다. string//stringlet str1: string = "hello";let str..

Study/Typescript 2024.09.15
728x90