iview-select选择器组件的使用&设置默认选中的值

一,Select选择器使用

html 

    <Select v-model="model15" prefix="ios-home" style="width:200px">
        <Option v-for="item in cityList" :value="item.id" :key="item.id">{{ item.name }}</Option>
    </Select>

data

              cityList: [
                    {
                        id: ‘204‘,
                        name: ‘New York‘
                    },
                    {
                        id: ‘205‘,
                        name: ‘London‘
                    },
                    {
                        id: ‘206‘,
                        name: ‘Sydney‘
                    },
                    {
                        id: ‘207‘,
                        name: ‘Ottawa‘
                    },
                    {
                        id: ‘208‘,
                        name: ‘Paris‘
                    },
                    {
                        id: ‘209‘,
                        name: ‘Canberra‘
                    }
                ],
                // 数据双向绑定的值
                model15: ‘‘

二,数据回显(默认选中的值)

this.model15 = row.id    // 点击修改时获取行数据中的这个id,将这个id赋值给select的v-model绑定的值

就实现数据回显 

原文地址:https://www.cnblogs.com/duhui/p/12145158.html

时间: 2024-07-31 05:41:19

iview-select选择器组件的使用&设置默认选中的值的相关文章

jQuery设置 select、radio、checkbox 默认选中的值

[javascript] view plain copy <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m

HTML中的&lt;select&gt;标签如何设置默认选中的选项

方法有两种. 第一种通过<select>的属性来设置选中项,此方法可以在动态语言如php在后台根据需要控制输出结果. 1 2 3 4 5 < select  id =  "sel" > < option  value = "1" >1</ option > < option  value = "2"  selected = "selected" >2</ opt

Dojo Tree设置默认选中项并且获得它

在使用CSS3的中有如下类似代码 Html代码 @media screen and (max-width:480px){ -- } 意思是在最大宽度为480px的设备上应用{}里面的样式.这里的width,注意是手机浏览器的分辨率,而不是手机设备的屏幕分辨率.比如苹果4的手机屏幕分辨率是960x640.而其自带的Safari浏览器的分辨率是320*480.我们可以通过如下代码检测所用的浏览器的分辨率: Js代码 $("#info").html("(您的浏览器的分辨率为:&qu

vue中select的使用以及select设置默认选中

简介 今天写pc端引入vue,遇到了一个问题,就是我循环出select内的数据以后,发现原本默认显示第一条的select框变成了空白,要选择后才有显示,结果查了好多文档,讲的都不是很清楚,后来看到一句提示,试了一下发现居然还有这种隐藏属性.所以,我决定自己写下来,讲清楚. 解决过程 html代码如下,通过v-model可以获取到选中的值,如果option中存在value属性,优先获取value值即coupon.id,如果不存在,则获取option的文本内容,也就是下面代码中coupon.name

Hbuilder MUI 选择器(Picker)设置默认选项

mui 联动选择初始化很多人都遇到问题,就是setselectedvalue 不好用,实际上这个地方应该是有bug的 所以只能用setselectedindex 来实现 下面我是我的实现方式供大家参考: <script> (function($, doc) { $.init(); $.ready(function() { //----------------------------------------- // //级联示例 var cityPicker3 = new $.PopPicker

JS向页面select添加元素 设置默认选中并移除点击下拉事件

$("#major").append(""+'运输工程监理'+""); $("#major option[value='运输工程监理']").prop("selected",true); $("#major").attr("disabled","disabled"); PS:$("#major").removeAttr(&quo

html中&lt;radio&gt;单选按钮控件标签用法解析及如何设置默认选中

<input type="radio" name="radio" value="1">单选1 <input type="radio" name="radio" value="2">单选2 <input type="radio" name="radio" value="3" checked>单选

Bootstrap模板Metronic设置默认选中侧边栏

一开始我们拿到的模板页面如下图所示,但是在给出的模板中,每个页面都包含了左侧的侧边栏代码,这在我们开发系统的时候,显然不能这么做,不利于变更,重复性也很大,但是如果是放在一个文件中统一包含进来的话,就涉及到要如何让侧边栏正确选中当前页面的链接,而不是人工的却设置tab的开关. 通过看模板的源码,发现了一个函数setSidebarMenuActiveLink,在侧边栏的选项链接中,为每个链接设置一个ID,代码如下所示: <li class="start active open"&g

单选框radio总结(获取值、设置默认选中值、样式)

<div class="radio-inline"> <input type="radio" name="killOrder" value="1"/> <label for="killOrder1">是</label> </div> <div class="radio-inline"> <input type=