Обработка данных из опций выбора формы в Vue - PullRequest
Новая
       7

Обработка данных из опций выбора формы в Vue

0 голосов
/ 05 февраля 2020

У меня есть эта форма выбора: 

  <div class="control">
        <div class="select">
          <select v-model="chart.traces">
             <option v-for="option in options" v- bind:value="option.value">
    {{ option.text }}
  </option> 
           </select>
        </div>

      </div>

Который получает данные в компоненте: 

data() {
    return {
      options:[
        {text: "Financial Condition", value: [ {
            x: [1, 2, 3, 4],
            y: [10, 15, 13, 17],
            mode: 'markers',
            type: 'scatter',
            name: 'Companies'
          }, {
            x: [5],
            y: [8],
            mode: 'markers',
            type: 'scatter',
            name: 'Checked'
          }
            ]},
        {text: "Ebitda", value: [ {
            x: [2, 1, 3, 6],
            y: [11, 12, 12, 17],
            mode: 'markers',
            type: 'scatter',
            name: 'Companies'
          }]
        }
      ]

Теперь мне нужно набрать sh эти данные зависят от того, что выбрано для другой объект данных внутри компонента: 

traces: []

Однако каким-то образом объект traces не заполняется в зависимости от того, что выбрано. Вот Codepen, где вы можете проверить, что происходит: Codepen

1 Ответ

2 голосов
/ 05 февраля 2020

Там есть опечатка: v- bind:value="option.value".

Так и должно быть v-bind:value="option.value"

  <div class="control">
    <div class="select">
      <select v-model="chart.traces">
        <option v-for="option in options" v-bind:value="option.value">{{ option.text }}</option>
      </select>
    </div>
  </div>
...