본문 바로가기
  • 실행력이 모든걸 결정한다
Frontend/FormKit

[FormKit] 특정 input 필드값을 무시하기

by 김코더 김주역 2024. 3. 18.
반응형

특정 FormKit input에 ignore prop을 true로 두면 상위 form에서 값을 걸러준다.

input 형태만 필요하고 굳이 내보낼 데이터가 없는 경우에 유용할 것 같다.

<template>
  <FormKit type="form" v-model="values" :actions="false">
    <FormKit
      type="email"
      name="email"
      label="이메일"
      :ignore="true"
      placeholder="example@domain.com" />
    <FormKit type="password" name="password" label="비밀번호"/>
  </FormKit>
  {{ values }}
</template>

 

 

이제 위의 {{ values }} 값을 찍어보자.

 

:ignore="false"인 경우 (default)

당연히 input field의 value값이 찍힐 것이다.

 

:ignore="true"인 경우

form 자체에서 잘 걸러주는 모습을 볼 수 있다.

 

여담으로, 해당 내용은 아래 공식문서에 있는데 이런 내용은 카테고리로 Button보다는 Form에 들어가는 것이 어울리지 않나 하는 개인적인 생각이다.

https://formkit.com/inputs/button#ignored-input

 

Button Input ⚡️ FormKit

The button input uses HTML's native button element. The label prop is used to populate the text of the button — or alternatively you can use the default slot. The easiest way to set the label of a button is with the label prop: The default slot can also

formkit.com

 

반응형

댓글