select下拉框获取该条数据的其他属性 解决思路是：通过v-model指令，在select标签上通过v-model指定一个属性值，然后通过这个属性值访问该记录的属性值。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>vue select bind data</title> </head> <body> <div id="app"> <select v-model="selectedItem"> <option v-for="item in items" :value="item">{{item.title}}</option> </select> </div> </body> <script type="text/javascript" src="../../static/js/vue.js"></script> <script> var app = new Vue({ el: '#app', data:{ selectedItem:null, items:[ {title: 'vue', price:123}, {title: 'java', price:345}, {title: 'linux', price:456}, {title: 'python', price:890} ] }, watch:{ selectedItem(){ console.log(JSON.stringify(this.selectedItem)) } } }) </script> </html>
[Vue warn]: Do not use built-in or reserved HTML elements as component id: main
问题可能是创建的 vue 文件名称和 export default name 重复了。