allblack의 개발 새발 allblack의 개발 새발

methods type:{ [key: string]: Function } Ex> import { Vue } from "vue-class-component"; export default class Home extends Vue { methodsCount() { console.log("methods"); return this.countMethods; }, } import { Vue, Options } from "vue-class-component"; @Options({ methods: { methodsCount() { console.log("methods"); return this.countMethods; }, }, }) export default class Home extends Vue {} compute..

-data- type: function 설명 컴포넌트 인스턴스에 데이터 객체를 반환하는 함수입니다. Ex> // 인스턴스를 생성합니다. const data = { a: 1 } // 객체를 컴포넌트 인스턴스에 추가합니다. const vm = Vue.createApp({ data() { return data } }).mount('#app') console.log(vm.a) // => 1 import { Options, Vue } from "vue-class-component"; @Options({ data() { return { test2: "etst2", }; }, }) export default class Home extends Vue {} import { Vue } from "vue-class-comp..

컴포넌트끼리 값을 공유하는 방법 props storage 상태 관리 라이브러리 props 이용해서 최상위 component에서 최하위 component로 정보를 props를 이용해서 보내는 것은 너무나도 비효율적입니다. 그러나 storage, 상태 관리 라이브러리를 이용하기에는 애매한 경우가 있습니다. vue는 이러한 상황을 해결하기 위해 provide/inject개념을 만들게 되었습니다. Provide / Inject란? provide는 값을 제공하는 역할 Inject는 제공받은 값을 component에 추가하는 역할 사용방법 parents child {{ test }} *provide 값을 반드시 변수값으로 할 필요는 없습니다. 이렇게만 보면 엄청나게 편리한 기능이라고 느껴집니다. 귀찮게 props ..