성별 조건에 맞는 아이템 출력시 공용은 출력안됨

<label>
  <input type="checkbox" name="gender" value="1" v-model="state.genderList"> 여성
</label>
<label>
    <input type="checkbox" name="gender" value="2" v-model="state.genderList"> 남성
</label>

• 문제)
  db에 여성은 1, 남성은 2, 공용은 3으로 저장했기에 여성을 선택하면 state.genderList 배열에 1,3 남성을 선택하면 2,3이 들어가도록 하고 싶었으나.. value는 한가지 값만 담을수 있었음...

• 해결)

<label>
  <input type="checkbox" name="gender" value="1" v-model="state.genderList" @change="handleChange"> 여성
</label>
<label>
    <input type="checkbox" name="gender" value="2" v-model="state.genderList" @change="handleChange"> 남성
</label>

change함수를 이용

const handleChange = () => {
  if (state.genderList.includes("1")) {
    state.genderList.push("3");
  } else if (state.genderList.includes("2")) {
    state.genderList.push("3");
  } else {
    state.genderList = [];
  }
  handleData();
};

이렇게 할 경우 watch에서 state.genderList를 없애야됨. 그대로 두니까 여성 클릭시 여성용 먼저 불러오고 공용을 불러오는 시간차 로딩이 보였음