Как получить все данные item из селекта?

Question

[Федор Ашифин]

Доброго времени суток!
пишу небольшой калькулятор на vue
Например волюту я получаю с бека в массиве currencies_data
Перебираю и выводу через select

<select class="form-control" v-model="price_curren">
              <option v-for="curren in currencies_data"
                      :key="curren.code"
                      class="valuta_name"
                      :value="curren.value"
              >
                {{curren.title}}
              </option>
            </select>

Таким образом я в v-model получаю курс валюты на которую умножаю результат
Для примера в компьютед создаю

calcSum(){
        let res = this.price_curren * (this.price_site + this.price_servises)
        return parseFloat( res.toFixed(1)) // вот здесь нужно название валюты curren.code
      }

А как мне получить код валюты curren.code или название curren.title чтоб вывести в результате?
Понимаю что ответ простой и рядом, но не хватает знаний в vue
Это первый рабочий проект

Answer 1

[Даниил Попов]

Установите :value="curren" и получайте от него все, что нужно

Примерчик https://jsfiddle.net/groog/L63yk01u/4/

Comments

[Федор Ашифин]

Спасибо! Просто уже завтыкал)) Решение как всегда простое !

[Даниил Попов]

ashfedor, пожалуйста)
Кстати, parseFloat( res.toFixed(1)) штука медленная и вообще некрасивая. Лучше округляйте через математические функции:

Math.round(value * 10**precision) / 10**precision

где precision - это необходимое число знаков после запятой

[Федор Ашифин]

Даниил Попов, Спасибо, заменю

[Федор Ашифин]

Даниил Попов, А не подскажите как нужному пункту selected прописать

<option v-for="curren in currencies_data"
                      :key="curren.code"
                      v-if="curren.value === 1" selected
                      class="valuta_name"
                      :value="curren"
              >
                {{curren.title}}
              </option>

не работает

[Даниил Попов]

ashfedor, при рендере установится то значение, которое в переменной selected.
После запроса данных или при монтировании компонента нужно указать значение явно.
Например,

{
...
  beforeMount() {
    this.selected = this.currencies_data[0]
  }
...
}

[Федор Ашифин]

Спасибо! разобрался, пришлось в доках найти вариант и под себя переделать
сбил с толку selected

beforeMount() {
      this.price_curren = this.currencies_data[0]
    }

Вобщем спасибо!

[Даниил Попов]

ashfedor, тут я вас несознательно запутал взяв переменную из своего примера и массив из вашего. Зато вы немного разобрались и уловили суть