javascript - 迭代数据脚本中的键

Question

我试图弄清楚如何将下拉菜单中的用户输入值与 ID 对象与 Vue 中与下拉菜单选项匹配的键进行比较。

例子：

<template>  
  <select v-model="selectMenu">  
    <option v-for"select in selections">{{ selection }}</option>  
  </select>  
</template>  

<script>  
export default {  
  data() {
    return {  
      selectMenu: '', 
      selections: [ 'one', 'two', 'three' ],  
      ids: {
        one: 'dfs745jfdb',
        two: 'adfjdsh3gf5',
        three: 'ag23dsgnsj'
      }
    }
  }
}
</script> 

我想出了一个更简单的方法。我对 vue 和编码很陌生。我所做的是将选择和 id 组合成一个数组，如下所示 ：

<template>  
  <select v-model="selectMenu">  
    <option v-for"selectId in selectIds" v-bing:value="selectId.id">
    {{ selectId.text }}
    </option>  
  </select>  
</template>  

<script>  
export default {  
  data() {
    return {  
      selectMenu: '', 
      selectIds: [
        { text: 'one', id: 'dfs745jfdb' },
        { text: 'two' id: 'adfjdsh3gf5' },
        { text" 'three' id: 'ag23dsgnsj' }
      ]
    }
  }
}
</script>

标签： javascriptvue.jsvuejs2

Answer 1

this.ids[this.selectMenu]应该给你 ids 对象中的对象。