<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. [转帖]ubuntu 修改 apt源的方法

    https://www.cnblogs.com/dadonggg/p/11129973.html ubuntu 和 centos 是不一样的 ubunut 里面 用deb开头 放置到 /etc/apt ...

  2. cdoj 574 High-level ancients dfs序+线段树 每个点所加权值不同

    High-level ancients Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/#/problem/s ...

  3. 剑指offer42:数组和一个数字S,输出两个数的乘积最小的

    1 题目描述 输入一个递增排序的数组和一个数字S,在数组中查找两个数,使得他们的和正好是S,如果有多对数字的和等于S,输出两个数的乘积最小的. 输出描述: 对应每个测试案例,输出两个数,小的先输出. ...

  4. 为什么要使用 SPL中的 SplQueue实现队列

    今天看php的SPL标准库部分里面涉及到数据结构其中有 SplQueue 来实现队列效果,但是我刚接触php的时候学习到的是 使用array的 array_push 和 array_pop 就可以实现 ...

  5. 前端模拟数据接口json-server

    今天要找帮前端找一个可以实现数据接口模拟的工具.首先看到的mock.js这个.但是这个需要在页面里插入Mock.js我是要给小程序使用,所以不能这么插入.然后又找到了json-server这个Node ...

  6. 2.安装阿里yum源

    1.删除自带的yum源:#cd /etc/yum.repos.d/#rm -rf *   2.配置远程yum源:wget -O /etc/yum.repos.d/CentOS-Base.repo ht ...

  7. User space(用户空间) 与 Kernel space(内核空间)

    出处: User space 与 Kernel space (整理)用户空间_内核空间以及内存映射 学习 Linux 时,经常可以看到两个词:User space(用户空间)和 Kernel spac ...

  8. shell脚本查询某一目录的某一部分文件并且拷贝到其他目录(有则跳过没有则拷贝)

    #!/bin/bash dir=`ls /root//*` for i in $dir do #basename 返回一个字符串参数的基本文件名称.(只剩下文件名除去路径名) a=`basename ...

  9. nginx日志模块、事件模块

    日志模块 1.access_log指令 语法: access_log path [format [buffer=size [flush=time]]]; access_log logs/access. ...

  10. 怎样获取所有style节点

    通过 document.styleSheets 获取所有的样式表节点. document.styleSheets instanceof StyleSheetList; // true 注意: 1. 返 ...