vue elementUI select下拉框设置默认值

2023-11-12

关于element select框默认值赋值不成功问题,注意两点:

v-model里面的数据和遍历出来value值数据类型不一样。!!!!
(例:item.provinces类型是number,province类型是String。类型不一样导致赋值不成功)
遍历数据和赋值的先后顺序,必须保证数据先遍历后赋值。!!!
 

要为select下拉框设定默认值,只需要把 v-model 绑定的值和你想要选中 option 的 value 值设置一样即可。

下面上代码:

html部分代码:

<el-select v-model="valuetype"  @change="changetype">
    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
    </el-option>
</el-select>
export default {
        data() {
            return {
                options: [
                    {
                        value: 'all',
                        label: '全部'
                    },
                    {
                        value: 'model',
                        label: '型号'
                    },
                    {
                        value: 'machine',
                        label: '机器'
                    }
                ],
                valuetype: 'all',
            };
        },
     }

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

vue elementUI select下拉框设置默认值 的相关文章

  • 在 contenteditable div 中选择范围

    我有一个contenteditablediv 和其中的一些段落 这是我的代码 div style border solid 1px black width 300px height 300px div Hello world div div
  • socket.io 的良好初学者教程? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • JavaScript 中的埃拉托斯特尼筛法对大量数据无限运行

    我一直在尝试写埃拉托斯特尼筛法 http en wikipedia org wiki Sieve of EratosthenesJavaScript 中的算法 基本上我只是按照以下步骤操作 创建从 2 到 n 1 的连续整数列表 令第一个素
  • 为什么我的淘汰单选按钮在另一个具有点击绑定的元素内时会失败?

    我有一个单选按钮列表 我想要点击 li 他们还检查单选按钮 这一切都有效 直到我放了一个name单选元素上的属性 然后我的代码停止工作 我的代码如下所示 ul li li ul li
  • Three.js:缩放几何图形后错误的 BoundingBox

    在我的场景中 我有一个简单的立方体 var test new THREE Mesh new THREE CubeGeometry 10 10 10 new THREE MeshBasicMaterial scene add test 该立方
  • 使用 JavaScript 禁用第三方 cookie

    我正在努力根据所有在欧盟运营的公司的数据保护规则实施新的 Cookie 政策合规性 根据该规则 用户在使用任何网站时必须能够拒绝 接受除必需的 Cookie 之外的所有内容 在我客户的网站中 我可以看到正在存储以下第三方 cookie ga
  • 可以在初始 DOM 解析期间/之前修改 DOM 吗?

    是否可以在初始 DOM 解析期间或之前修改 DOM 或者我是否必须等到 DOM 被解析和构建之后才能与其交互 更具体地说 是否有可能阻止 DOM 中的脚本元素使用用户脚本 内容脚本或 Chrome 或 Firefox 中的类似脚本运行 在解
  • 使用 dc.js 按条形值对条形图中的条形进行排序(排序)

    如何通过维度的计算值而不是维度本身的名称对 dc js 示例中的 x 轴 维度 进行排序 例如 请考虑序数条形图的 dc js 示例 https github com dc js dc js blob master web examples
  • Snap.svg - 停止在可悬停元素的子元素上重新触发悬停事件

    对于一个项目 我使用的 SVG 形状由背景多边形和背景多边形上方的一些文本 我已将其转换为路径 组成 我正在使用 Snap svg 为我的形状设置动画 当我将鼠标悬停在多边形上时 形状应该缩放到特定尺寸 包括其中的所有内容 鼠标移开时 形状
  • React-Redux:state.setIn() 和 state.set() 有什么区别?

    我见过使用setIn and set 在一些react redux代码中 state setIn state set 我在这里找到了一些文档https facebook github io immutable js https facebo
  • Bootstrap按钮加载+Ajax

    我正在使用 Twitter Bootstrap 的按钮加载状态 http twitter github com bootstrap javascript html buttons http twitter github com bootst
  • 防止 iOS 键盘在 cordova 3.5 中滚动页面

    我正在使用 Cordova 3 5 和 jQuery mobile 构建 iOS 应用程序 我在大部分应用程序中禁用了滚动功能 但是 当我选择输入字段时 iOS 键盘会打开并向上滚动页面 我不想要这个功能 由于输入足够高 键盘不会覆盖它 我
  • 将 UMD Javascript 模块导入浏览器

    你好 我正在对 RxJS 进行一些研究 我可以通过在浏览器中引用它来使用该库 如下所示 它使用全局对象命名空间变量 Rx 导入 我可以制作可观察的东西并做所有有趣的事情 当我将 src 更改为指向最新的 UMD 文件时 一切都会崩溃 如下所
  • 页面上使用 HTML Editor Extender 进行回发会导致 IE11 中出现 JavaScript 错误

    我已将 HTML 编辑器扩展程序添加到我正在处理的页面中 现在每当我在页面上发回帖子时 都会收到以下 Javascript 错误 JavaScript 运行时错误 参数无效 之后什么也没有发生 这在 IE10 或更低版本以及我所知道的所有其
  • 可以设置标题样式吗? (并且使用CSS或js?)[重复]

    这个问题在这里已经有答案了 我想知道是否可以设计一个title a href title This is a title Hello a 样式问题有两个方面 文本格式 编码 我猜这是可能的 所以在问题中这样做 工具提示样式 你能把它弄大一点
  • Firebase 函数 onWrite 未被调用

    我正在尝试使用 Firebase 函数实现一个触发器 该触发器会复制数据库中的一些数据 我想观看所有添加的内容votes user vote 结构为 我尝试的代码是 const functions require firebase func
  • 正则表达式 - 从 markdown 字符串中提取所有标题

    我在用灰质 https www npmjs com package gray matter 以便将文件系统中的 MD 文件解析为字符串 解析器产生的结果是这样的字符串 n Clean er ReactJS Code Conditional
  • Three.js 各种大小的粒子

    我是 Three js 的新手 正在尝试找出添加 1000 个粒子的最佳方法 每个粒子都有不同的大小和颜色 每个粒子的纹理是通过绘制画布创建的 通过使用粒子系统 所有粒子都具有相同的颜色和大小 为每个粒子创建一个粒子系统是非常低效的 有没有
  • 如何用另一个响应替换窗口的 URL 哈希?

    我正在尝试使用替换方法更改哈希 URL document location hash 但它不起作用 function var anchor document location hash this returns me a string va
  • Vue.js[vuex] 如何从突变中调度?

    我有一个要应用于 json 对象的过滤器列表 我的突变看起来像这样 const mutations setStars state payload state stars payload this dispatch filter setRev

随机推荐

  • 残差网络模型

    1 原始残差网络 最基本的残差块 中间的两层神经网络学习输入输出之间的残差 而旁边的链接就像一个高速公路 使得反向传播算法中的残差能通过这条路传到前边去 当网络变深时可以使得中间的输出为0 那么网络就能自适应的变成一个浅一点的网络 左边ba
  • Java 根据EXCEL下标获取EXCEL的列名

    通过根据EXCEL下标获取EXCEL的列名 用于给单元格设置公式用 num 是以0开头的下标 public static String getExcelColumn Integer num if num null return null S
  • 树的概念:层次、高度、深度、宽度

    目录 层次 宽度 深度 高度 其中只有层次是树原生的概念 其他都是从树中的结点来的 层次 从根节点开始算起 根节点算第一层 如图所示的树 第1层 A 第2层 B C 第3层 D E F 第4层 G H I 宽度 其实就是度 把结点的子树的棵
  • 大并发下请求合并(并发处理技巧)

    大并发下请求合并 一次请求消耗的资源 旧的方式 改造后 批量请求处理器 批量请求包装类 使用 性能测试 旧的 改造后的 一次请求消耗的资源 我们经常碰到查询请求的操作 例如根据用户id查询该用户的信息 接口仓储层查询用户正常的做法是通过id
  • adam算法介绍和总结

    19 adam算法 Adam 是一种可以替代传统随机梯度下降 SGD 过程的一阶优化算法 它能基于训练数据迭代地更新神经网络权重 Adam 最开始是由 OpenAI 的 Diederik Kingma 和多伦多大学的 Jimmy Ba 在提
  • ubuntu18.04编译Openwrt出现的问题解决

    ubuntu18 04编译Openwrt出现的问题解决 问题1 Build dependency Please install Git git core gt 1 6 5 问题2 gdate c 2497 7 error format no
  • 微信小程序授权打开摄像头,授权相册保存图片

    1 授权打开摄像头 doTakePhoto let that this wx getSetting success res 第一次未授权 if res authSetting scope camera undefined wx author
  • vscode中配置代码片段

    步骤如下 设置 gt 用户代码片段 新增全局代码片段 起全局代码片段文件名 xxx code snippets 这里以配置vue2初始代码片段为例 配置具体代码片段 按enter进入文件配置 以下是vue2的代码片段示例 具体可以自己随意配
  • 若依缓存使用浅析

    配置 这块主要涉及两个类 FastJson2JsonRedisSerializer 继承 RedisSerializer 接口自定义使用 fastjson 进行序列化和反序列化 RedisConfig 配置使用 StringRedisSer
  • Vue大型项目之分模块运行/打包

    最近写的小项目比较多 而且都是差不太多的 每个项目创建个工程 多少有点不好维护 所以决定把他们放在一个项目下 以vue cli3 为例 实现多系统集成下的分模块打包 分模块打包方式多种多样 可以适用于多系统之间互不干扰 主系统可集成各子系统
  • antDesignPro自定义渲染展开列

    效果如图 先上代码 文件目录如图 在这里插入图片描述 index tsx import ProColumns ProTable from ant design pro components import PageContainer from
  • 订单功能模块设计与实现

    在商城项目中 之前我们介绍了购物车功能模块的实现 商品加入到购物车之后 就是到购物车结算 然后显示购物车的商品列表 点击去结算 然后到了未提交前的订单列表 点击提交订单后 生成此订单 返回订单的订单号 付款金额 订单预计到达时间 订单系统是
  • 电子设计小知识点汇总-发光二极管篇

    电子设计小知识点汇总 发光二极管篇 发光二极管在电路中 常作为指示接在电路的电源上观察电路上电是否正确 接在单片机上观看程序是否正常工作等各项工作 选型常关注一下几个方面 1 颜色 2 封装 有贴片的 插装的 3 正向电压 正向电流为规定值
  • java----抽象类和接口的联系和区别

    目录 一 抽象类 1 为什么使用抽象类 2 抽象类的特点 二 接口 1 为什么java使用接口 2 接口的特征 相同点 不同点 一 抽象类 1 为什么使用抽象类 抽象类是为了把相同的但不确定的东西的提取出来 为了以后的重用 定义成抽象类的目
  • ASP.NET MVC深入浅出(被替换) 第一节: 结合EF的本地缓存属性来介绍【EF增删改操作】的几种形式 第三节: EF调用普通SQL语句的两类封装(ExecuteSqlCommand和Sql...

    ASP NET MVC深入浅出 被替换 一 谈情怀 ASP NET体系 从事 Net开发以来 最先接触的Web开发框架是Asp Net WebForm 该框架高度封装 为了隐藏Http的无状态模式 ViewState功不可没 通过的控件的拖
  • 数据库的三级模式结构

    数据库管理系统 DBMS 从三个层次来管理数据 外部层次 External Level 概念层次 Conceptual Level 和内部层次 Internal Level 作用 数据库采用外模式 概念模式和内模式三级模式结构 并存在着二级
  • 检测到“RuntimeLibrary”的不匹配项: 值“MT_StaticRelease”不匹配值“MD_DynamicRelease”

    来源 http blog csdn net wpc320 article details 8496957 生成错误 error LNK2038 检测到 RuntimeLibrary 的不匹配项 值 MT StaticRelease 不匹配值
  • Selenium成长之路-15设置等待时间

    为了保证运行的脚本正常加载 我们需要的是设置等待时间 具体有以下几种 sleep 设置固定等待时间 主要由time包提供 也可叫强制等待 也就是说不管页面是否加载完成 都会等待这些时间 代码如下 coding utf 8 from sele
  • Java Thread类简介说明

    转自 Java Thread类简介说明 下文讲述Thread类的简介说明 如下所示 线程Thread 通俗的讲就是一个程序的多个并行的运行分支 路径 线程Thread 是CPU执行调度的单位 一个进程内的所有线程可以共享进程的资源 内存 设
  • vue elementUI select下拉框设置默认值

    关于element select框默认值赋值不成功问题 注意两点 v model里面的数据和遍历出来value值数据类型不一样 例 item provinces类型是number province类型是String 类型不一样导致赋值不成功