<template>
<div>
<select v-model="mychoice">
<option value="html">HTML</option>
<option value="css">CSS</option>
<option value="js">JS</option>
</select>
<p>Your choise is: <b>{{mychoice}}</b></p> </div> </template> <script>
export default {
data:function(){
return{
mychoice:''
}
}
}
</script> <style>
select {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: url(./arrow.png) no-repeat;
background-position-x: 99%;
background-position-y: 50%;
background-size: 15px;
border:1px solid #E0E0E0;
position: relative;
height:25px;
width:50%;
text-align-last: left;
left:24%;
}
p {
margin-top:8px;
position: relative;
width:50%;
text-align: center;
left:24%;
}
</style>

  

Vue : Select的更多相关文章

  1. vue select下拉框绑定默认值

    vue select下拉框绑定默认值: 首先option要加value值,以便v-model可以获取到对应选择的值 一.当没有绑定v-model,直接给对应的option加selected属性 二.当 ...

  2. vue select框change事件

    vue Select 中< :label-in-value="true" @on-change="satusSelect"> satusSelect ...

  3. Vue select 下拉菜单

    1.html <div id="app-8"> <select v-model="selected"> <option v-for ...

  4. 修改select样式,vue select

    <style> .selectbox{ width: 200px; display: inline-block; overflow-x: hidden; height: 28px; lin ...

  5. Ant Design Vue select下拉列表设置默认值

    在项目中需要为Ant Design Vue 的 select 组件设置一个默认值,如下图所示的状态下拉选择框,默认选择全部 代码如下: <a-select v-model="query ...

  6. vue select中的option循环的时候,要使用 :value,不能使用 v-model

    <select class="classColor" @change="select" v-model="selectValue"&g ...

  7. vue select的change事件,将点击过的城市名存在数组中,下次调用不需要再调用接口

    <template> <div id="body" class="application" v-show="show" v ...

  8. vue select二级城市联动及第二级默认选中第一个option值

    当二级联动比如选择国家的时候,希望选中一个国家的时候后面城市默认选中第一个城市,则给国家的select加一个@change事件就可以了 <div class="inputLine&qu ...

  9. Vue select默认选中第一个

    <td> <select v-model="selectWare"> <option selected="selected" va ...

随机推荐

  1. 2.4容错保护:Hystrix

    在ribbon使用断路器 改造serice-ribbon 工程的代码,首先在pox.xml文件中加入spring-cloud-starter-hystrix的起步依赖: 引入 <dependen ...

  2. poi 3061 尺取例题1

    题目传送门/res tp poj 白书题 尺取法例题 #include<iostream> #include<algorithm> using namespace std; c ...

  3. HTNL基础之二

    HTML实体字符 “<”:< “>”:> “空格”: ' / / '  “"”:"  “®”:®  “©”:© 列表 ①无序列表:列表用来在网页上组织信息, ...

  4. PHP的四种运行方式

    一丶cgi协议模式 cgi模式通用网关接口(Common Gateway Interface),它允许web服务器通过特定的协议与应用程序通信,调用原理大概为:用户请求->Web服务器接收请求- ...

  5. python学习-2 python安装和环境变量的设置

    python的下载 1.可以去python官网下载,https://www.python.org/ 2.下载完成后,安装即可.(具体可以百度,网上都有很多安装方法) python的检测 1.打开开始- ...

  6. 牛客 72C 小H和游戏 (动态点分治)

    大意: 给定树, 每个点初始权值0, 每次询问给出$x$, $x$权值+1, 求距离$x$不超过2的权值和. 这题数据范围过大, 动态点分治卡不过去, 考虑其他做法 考虑每次只加范围$1$, c[0] ...

  7. [NOIP10.6模拟赛]1.merchant题解--思维+二分

    题目链接: while(1)gugu(while(1)) 闲扯 考场上怕T2正解写挂其他两题没管只打了暴力,晚上发现这题思维挺妙的 同时想吐槽出题人似乎热衷卡常...我的巨大常数现在显露无疑QAQ 分 ...

  8. js中的函数提升和变量提升

    变量提升和函数提升: 就是将变量声明或者函数全部代码提升到当前作用域(全局作用域或函数作用域)最开始的部分. JavaScript中函数域为最小域范围:for循环.while循环.if语句.switc ...

  9. JAVA线程池例子

    用途及用法 网络请求通常有两种形式:第一种,请求不是很频繁,而且每次连接后会保持相当一段时间来读数据或者写数据,最后断开,如文件下载,网络流媒体等.另 一种形式是请求频繁,但是连接上以后读/写很少量的 ...

  10. SpringCloud之RabbitMQ安装

    本文介绍Linux以及MAC OS下的RabbitMQ安装及配置: 一.Linux环境下的RabbitMQ安装(CentOS) 1.安装ErLang Erlang(['ə:læŋ])是一种通用的面向并 ...