源码网,源码论坛,源码之家,商业源码,游戏源码下载,discuz插件,棋牌源码下载,精品源码论坛

 找回密码
 立即注册
楼主: ttx9n

[JavaScript] vue操作下拉选择器获取选择的数据的id方法

[复制链接]

7万

主题

861

回帖

32万

积分

论坛元老

Rank: 8Rank: 8

积分
329525
发表于 2018-8-24 14:06:39 | 显示全部楼层 |阅读模式
今天小编就为大家分享一篇vue操作下拉选择器获取选择的数据的id方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

实际项目中我们获取选择的数据的id;这时候 需要配合使用v-bind,才能获取到选择的那条数据的id值,其实就是id赋值给value属性

<template>
  <div>
    <select v-model="select" >
      <option v-for="(a,index) in arr" :key="index" :value="a.id">{{ a.name }}</option>
    </select>
    <p>您选择的名字的Id是:{{select}}</p>
  </div>
</template>

js代码

<script>
  export default {
    data(){
      return{
        select:'',
        arr:[
          {id:'1',name:'html'},
          {id:'2',name:'css'},
          {id:'3',name:'js'},
        ] 
      }
    }
  }
</script>

拓展知识:vue获取id以及重定向路由方法

1.获取ID的方法:

let orderId=this.$route.query.id; 

2.路由重定向方法

this.$router.push(this.$route.query.redirect || '/login') 

以上这篇vue操作下拉选择器获取选择的数据的id方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

回复

使用道具 举报

3

主题

2万

回帖

294

积分

中级会员

Rank: 3Rank: 3

积分
294
发表于 2022-8-22 20:31:43 | 显示全部楼层
看看看看看看看看看看看看看看看看看看看看看看看看看看看
回复 支持 反对

使用道具 举报

0

主题

1万

回帖

0

积分

中级会员

Rank: 3Rank: 3

积分
0
发表于 2022-10-22 01:13:16 | 显示全部楼层
女生看了弄丢了卡萨诺的卡洛斯
回复 支持 反对

使用道具 举报

0

主题

2万

回帖

0

积分

中级会员

Rank: 3Rank: 3

积分
0
发表于 2022-10-23 04:34:15 | 显示全部楼层
快更新啊,我擦
回复 支持 反对

使用道具 举报

16

主题

2万

回帖

376

积分

中级会员

Rank: 3Rank: 3

积分
376
发表于 2023-11-25 17:28:26 | 显示全部楼层
看看看咋么
回复 支持 反对

使用道具 举报

11

主题

1万

回帖

103

积分

注册会员

Rank: 2

积分
103
发表于 2024-3-31 23:26:55 | 显示全部楼层
额风风风微风微风违法
回复 支持 反对

使用道具 举报

1

主题

2万

回帖

307

积分

中级会员

Rank: 3Rank: 3

积分
307
发表于 2024-4-23 01:27:33 | 显示全部楼层
数据库了多久撒快乐的健身卡啦
回复 支持 反对

使用道具 举报

1

主题

2万

回帖

79

积分

注册会员

Rank: 2

积分
79
发表于 2024-7-28 21:36:24 | 显示全部楼层
8888888888888888
回复 支持 反对

使用道具 举报

6

主题

2万

回帖

425

积分

中级会员

Rank: 3Rank: 3

积分
425
发表于 2024-8-24 23:38:40 | 显示全部楼层
看看看咋么
回复 支持 反对

使用道具 举报

0

主题

2万

回帖

186

积分

注册会员

Rank: 2

积分
186
发表于 2024-8-31 16:49:53 | 显示全部楼层
看看看看
回复 支持 反对

使用道具 举报

高级模式
B Color Image Link Quote Code Smilies

本版积分规则

手机版|小黑屋|网站地图|源码论坛 ( 海外版 )

GMT+8, 2025-1-31 16:58 , Processed in 0.071463 second(s), 22 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表