[Week2] 23 06 13

useArrayDifference

📖 논의했던 내용

• toBe: 원시 타입의 경우 값이 같고, 객체 타입의 경우 참조가 같아야 한다.

• toEqual: 객체 또는 배열의 모든 field를 재귀적으로 같은 지 체크한다.

  toEqual recursively checks every field of an object or array.

• toBeUndefined: 값이 undefined인지 확인한다.

---

useCycleList

🤔 겪었던 문제점 공유

• watch 사용 시 값이 업데이트 되지 않는 문제 발생

📖 논의했던 내용

• ref 인지 아닌지를 확인하는 방법

  • vue-demi의 isRef를 통해 확인

• toRef: 값, ref, getter를 ref로 바꿔준다.

  • 넣어준 값이 ref일 경우 ref로 한 번 더 감싸는지, 아니면 그대로 반환하는지 확인 필요함

• computed의 get, set

  // writable
  function computed<T>(
    options: {
      get: () => T
      set: (value: T) => void
    },
    debuggerOptions?: DebuggerOptions
  ): Ref<T>
  
  

  • set에는 리턴값이 없다 → set의 return 값으로 설정되는 것이 아니라, computed에서 내에서 의존하고 있는 ref가 있고 그 ref의 값을 바꿔주는 방식으로 사용.

  Reactivity API: Core | Vue.js

• toValue

  • 값, ref, getters로부터 값을 추출해서 반환

  Reactivity API: Utilities | Vue.js

• shallowRef

  • ref의 shallow 버전. 객체일 경우, 객체 내부 property의 값이 바뀌어도 change를 트리거하지 않는다.

  Reactivity API: Advanced | Vue.js