1

Я пытаюсь сделать select компонент, мне нужно сделать, чтобы при выборе вызывался метод из которого бы я смог получить выбранный пункт.

<template>
  <div>
      <select v-model="selectedItem" v-on:change="$emit('selected', selectedItem )">
        <option v-for="item in items" v-bind:key="item.id">{{item.name}}</option>
      </select>
  </div>
</template>

<script>
  export default {
    name: 'Selector',
    props: ['items'],
    data() {
      return{
        selectedItem: null
      }
    }
  }
</script>

Вот пример json с которым работает этот селектор.

[
  {"id":6,"name":"test group 6"},
  {"id":7,"name":"test group 7"},
  {"id":8,"name":"test group 8"}
]

Мне нужно, чтобы возвращался весь пункт JSON'a, то есть, например, так : {"id":6,"name":"test group 6"} ну или id , но у меня возвращается то что показывается, то есть так: test group 6, как я могу сделать, чтобы объект целиком возвращался, а не только его имя?

1 ответ 1

1

нашел как это сделать, нужно было добавить атрибут :value

<template>
  <div>
      <select v-model="selectedItem" v-on:change="$emit('selected', selectedItem )">
        <option v-for="item in items" v-bind:key="item.id" :value="item" >{{item.name}}</option>
      </select>
  </div>
</template>

<script>
  export default {
    name: 'Selector',
    props: ['items'],
    data() {
      return{
        selectedItem: null
      }
    }
  }
</script>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.