beomy

1. Strict Mode strict 모드를 사용하기 위해서는 strict: true를 Vuex의 store를 만들 때 추가만 하면 됩니다. const store = new Vuex.Store({ // ... strict: true }) strict 모드에서는 state가 mutation 핸들러 외부에서 변경 될 때 마다 오류를 발생 시킵니다. 배포시 strict 모드를 꺼야 합니다. strict 모드는 부적절한 state의 변경을 감지하기 위해 state 트리를 관찰하기 때문에, 성능 저하가 발생합니다. 성능 이슈를 해결하기 위해서는 배포 버전에서는 strict 모드를 꺼야 합니다. const store = new Vuex.Store({ // ... strict: process.env.NODE_ENV..

state를 계산한 값을 사용해야 할 때가 있습니다. computed: { doneTodosCount () { return this.$store.state.todos.filter(todo => todo.done).length } } todos라는 state에서 done 상태인 리스트를 가져오고 싶을 때 위의 코드와 같이 작성할 수 있습니다. 하지만 여러 컴포넌트에서 이 코드를 사용해야 한다면, 위의 코드를 복사해야 한다는 단점이 있습니다. 동일한 코드를 복사하여 사용하게 된다면 당연히 유지보수는 힘들어지겠죠. 이 단점을 해결하기 하기 위해서 Vuex는 Getter 기능을 제공합니다. store에서 사용하는 컴포넌트의 computed 속성과 비슷하다고 생각하면 이해하기 쉽습니다. computed 속성 처럼..

getter getter는 객체의 프로퍼티를 가져오는 함수를 말합니다. 1. 문법 {get prop() { ... } } {get [expression]() { ... } } 파라미터prop프로퍼티를 가져올 함수 이름 expressionES6에서 추가되었습니다. 계산 되어지는 프로퍼티 이름을 위해 expression이 추가되었습니다. 밑에서 코드로 설명드리겠습니다. 2. 설명동적으로 계산이 필요한 프로퍼티 값을 가져와야 할 때, getter를 사용한다면 별도의 함수를 만들 필요가 없습니다. getter를 사용할 때 3가지에 유의해야 합니다.1. 식별자로 숫자와 문자를 모두 사용할 수 있습니다.2. 파라미터가 없어야 합니다.3. 리터럴 객체의 같은 이름의 get이나 동일한 이름의 프로퍼티를 가질 수 없습니..