programing

vue.model의 중첩된 사용자 지정 구성 요소에서 v-model을 사용하는 방법

shortcode 2022. 8. 30. 22:39
반응형

vue.model의 중첩된 사용자 지정 구성 요소에서 v-model을 사용하는 방법

HTML과 같이 두 수준 깊이 중첩된 구성 요소에 v-model을 사용하는 방법

<opening-hr-field v-model="day"> </opening-hr-field>

여기서day는 오브젝트입니다. {is24Open: true, startTime: '5:00 PM'}

JS 템플릿

<template type="text/x-template" id="opening-hr-field-template">
  <div>
    <input type="checkbox" v-model="value.is24Open"> 24 hour
     <time-select v-model = "value.startTime"></time-select>
  </div>
</template>

<template  type="text/x-template" id="time-select-template">
  <select :value="value" 
    v-on:input="$emit('input', $event.target.value)">
    <option v-for="t in getHours()">
      {{ t }}
    </option>
  </select>
</template>

여기 2레벨의 깊이 v-model이 있습니다.어떻게 하면 두 번째 템플릿에서 첫 번째 템플릿으로, 그리고 부모에게까지 내보내기를 전파할 수 있을까요?예를 들어 주시겠습니까?

언급URL : https://stackoverflow.com/questions/43580936/how-to-use-v-model-in-nested-custom-components-in-vue-js

반응형