Programing

선택 항목을 사용할 때 문자열이 아닌 부울을 반환하는 방법

c10106 2022. 5. 19. 22:17
반응형

선택 항목을 사용할 때 문자열이 아닌 부울을 반환하는 방법

나 이거 있어.-

            <div class="form-group">
                <label for="">Allow Multiple</label>
                <select class="form-control" v-model="allowMultiple">
                    <option value=true>Yes</option>
                    <option value=false>No</option>
                </select>
            </div>

나는 설정했다.allowMultiple=true초기화할 때, 아니오를 선택하면allowMultiple='false'그럼 이제 부울이 아니라 스트링?어떻게 하면 부울이 될 수 있을까?

HTML에서 태그에 속성 값을 설정하면 값은 기본 유형--string.그래서 vue를 사용할 수 있다.v-model예를 들어 부울, 숫자 등 다른 유형 값에 바인딩하십시오.다음 코드가 작동하면 원하는 결과가 나타남

new Vue({
  el:'#app',
  data: {
    allowMultiple: false
  },
  methods: {
    print: function () {
      alert(this.allowMultiple);
    }
  }
})
<div class="form-group" id='app'>
   <label for="">Allow Multiple</label>
   <select class="form-control" v-model="allowMultiple" @change='print'>
        <option :value='true'>Yes</option>
        <option :value='false'>No</option>
   </select>
</div>
<script src="https://unpkg.com/vue@2.4.2/dist/vue.min.js"></script>

부에에서 그것을 하는 방법은 다음과 같다.html로 옵션을 하드 코딩하는 대신Vue 방법을 사용하여 Vue 데이터에 옵션 배열을 설정한 다음v-for배열에서 모든 옵션을 렌더링하십시오.

각 옵션에는 텍스트와 값의 두 가지 속성이 있어야 한다.값은 찾고 있는 부울 값이어야 한다.

이제 사용자가 선택한 옵션을 변경할 때마다 항상 부울이 된다.

new Vue({
  el: '#app',
  data: {
    allowMultiple: true,
    options: [
      {text: 'Yes', value: true},
      {text: 'No', value: false},
    ],
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.min.js"></script>


<div id="app">
  <div class="form-group">

      <div>Allow multiple: {{allowMultiple}}  [Type: {{typeof allowMultiple}}]</div><br>

      <label for="">Allow Multiple</label>
      <select class="form-control" v-model="allowMultiple">
          <option v-for="option in options" :value="option.value">{{option.text}}</option>
      </select>
  </div>
</div>

더 쉽고 빠르게 내게 효과가 있는 방법을 찾아낸 방법은 다음과 같다.

<select id="selected" v-model="item.selected">
    <option :value=0>No</option>
    <option :value=1>Yes</option>
</select>

누구에게나 쓸모가 있을지도 몰라.

다음을 시도해 보십시오.

<option value=1>Yes</option>
<option value=0>No</option>

참조URL: https://stackoverflow.com/questions/45264923/how-to-return-boolean-and-not-string-when-using-select

반응형