[记录贴]：Element_ui关于日期组件选择回显问题

最新推荐文章于 2023-06-29 09:23:56 发布
最新推荐文章于 2023-06-29 09:23:56 发布
阅读量2k 收藏 2
点赞数 1
分类专栏： 记录贴 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/T_emmmm/article/details/106571392
版权

之前用element-ui的 el-date-picker 组件碰到问题 记录一下

进入页面后，我先在created钩子方法里先获取后端传入的日期显示到组件中，之后发现个问题就是，再进行日期选择，选择的日期不会回显，或者会延迟显示，百度了好久也没找到解决方法

最后发现 positionDate 没有在data()里面声明，导致回显有延迟，vue是双向绑定，要在data()里面声明才可以立刻刷新。

解决方法：prop的值需要在data()里面声明
在这里插入图片描述

T_emmmm
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
基于element ui 二次封装的el-tree组件，支持懒加载数据，多选和单选，以tag方式回显输入框中，支持删除tag
01-24
树形下拉选择组件，下拉框展示树形结构，提供选择某节点功能 基于element ui 二次封装的el-tree组件，支持懒加载数据，多选和单选，以tag方式回显输入框中，支持删除tag，提供调用组件示例代码
vue2.0 使用element-ui里的upload组件实现图片预览效果方法
10-18
今天小编就为大家分享一篇vue2.0 使用element-ui里的upload组件实现图片预览效果方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
使用element-ui的upload组件实现上传图片和pdf可查看方法
08-20
使用element-ui的upload组件实现上传图片和pdf可查看方法
Element el-date-picker 表单校验和数据回显问题解决方法详解
pleaseprintf的博客
06-29 4315
在 Vue.js 开发中，使用 Element UI 组件库的 el-date-picker 组件可以方便地实现日期选择功能。然而，在表单校验和数据回显方面可能会遇到一些问题。本文将详细介绍如何解决 Element el-date-picker 组件在表单校验和数据回显过程中的常见问题。如果需要对 el-date-picker 进行更复杂的校验，可以自定义校验方法。data() {return {// 自定义禁用日期规则 return time . getTime() > Date . now();
【vue】elementui中，el-date-picker组件只能选择当前年份中的日期
m0_63834711的博客
12-16 8507
撒花✿。
element-ui 列表中的时间展示去掉时分秒只展示2020-03-20
qq_41781984的博客
08-24 3890
element-ui 列表中的时间展示去掉时分秒只展示2020-03-20 <el-table-column prop = "buildTime" :formatter="formatterTime"/> 在methods里面 formatterTime(row,column){ let data = row[column.property] return /\d{4}-\d{1,2}-\d{1,2}/g.exec(data ) } ...
Date时间格式只显示年月日，没有时分秒
weixin_65884708的博客
06-09 1018
这个是因为数据库字段设置原因，把原来的date类型改成datetime类型，就可以显示出年月日-时分秒的形式了。
element-ui时间选择器（DatePicker ）数据回显
zhangxueyou2223的博客
11-20 8896
需求：element-ui时间选择器（DatePicker ）数据回显，后台返回的数据，需要前台回显展示出来。绑定值的格式保持一致就可以回显，否则是不能回显的，我这里得到的数据格式是年月日时分秒，需要展示的是月份日期（yyyy-MM-dd），所以我给timePicker绑定值的格式也设置为yyyy-MM-dd。绑定值的格式转换成你要显示的格式，让你要回显的值和【保持一致就可以回显了！
elementUi中的DateTimePicker 日期时间选择器回显问题
songJunFeng1的博客
12-06 4579
当你发现你给对象加了一个属性，在控制台能打印出来，但是却没有更新到视图上时，也许这个时候就需要用到this.$set（）这个方法了，简单来说this.$set的功能就是解决这个问题的啦。官方解释：向响应式对象中添加一个属性，并确保这个新属性同样是响应式的，且触发视图更新。它必须用于向响应式对象上添加新属性，因为 Vue 无法探测普通的新增属性 let date2 = []; this.$set(this.date2,0,new Date(res.data.effectDate));//回显的日期 thi
记录：vue+element：DateTimePicker 不能选择当前时间前的时间（包括时分秒）
weixin_50622621的博客
07-06 1944
在项目中遇到的，限制不能选着比当前时间小的日期时间（包括时分秒），添加时间区间选择，使用了moment插件。
element-ui 远程搜索组件el-select在项目中组件化的实现代码
10-15
主要介绍了element-ui 远程搜索组件el-select在项目中组件化，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
基于element-ui封装可搜索的懒加载tree组件的实现
10-15
主要介绍了基于element-ui封装可搜索的懒加载tree组件的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
element-ui 时间组件datePicker开始时间小于结束时间的校验，时分秒校验问题。
m0_38105640的博客
10-12 4201
一、安装引入element-ui npm i element-ui -S 完整引入 在 main.js 中写入以下内容： import Vue from 'vue'; import ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; import App from './App.vue'; Vue.use(ElementUI); new Vue({ el: '#app', render:
element-ui Calendar 日历渲染自定义文案
xinTianou123的博客
06-18 1438
element-ui Calendar 官网链接 官网的只有一个基础的日历展示，但是提供了插槽，使得我们可以自定义日历单元格 dateCell scoped slot 参数 参数 说明 类型 date 单元格代表的日期 Date data { type, isSelected, day}，type 表示该日期的所属月份，可选值有 prev-month，current-month，next-month；isSelected 标明该日期是否被选中；day 是格式化的日期，格式为 yyyy-M
【VUE】el-date-picker常用属性及相关问题
SZnAl的博客
09-16 1万+
日期选择器回显、设置日期选择器不可手动输入，只能点选、设置日期选择器只能选择近180天内、设置日期选择器选择日期后默认时间、elementUI日期组件报错“dateStr.match is not a function”
【element UI】解决el-date-picker选择日期后视图不更新的问题，亲测有效
蓦然一笑的博客
09-09 8517
解决el-date-picker选择日期后视图不更新的问题，亲测有效。 date-picker日期选择器重新赋值后再点击日期进行选择，却发现视图没有更新**，提交后反而会显示修改后的结果。 最后通过this.$forceUpdate()强制更新解决问题！！！
VUE + ElementUI el-date-picker选中日期没反应
热门推荐
LEON_RAY
10-20 1万+
添加代码： @input="$forceUpdate()" 例： <el-date-picker v-model="value" type="date" value-format="yyyy-MM-dd" @change="getList" @input="$forceUpdate()" placeholder="选择日期"> </el-date-picker>
机械设计家用手摇面条机sw18可编辑非常好的设计图纸100%好用.zip
最新发布
05-01
机械设计家用手摇面条机sw18可编辑非常好的设计图纸100%好用.zip
Element-ui： el-cascader 单选回显
07-29
要实现 el-cascader 的单选回显，你可以使用 v-model 绑定一个变量来保存选择的值，并且在初始化时给这个变量赋初值。 首先，在你的 Vue 组件中添加一个变量来保存...详细的配置说明可以参考 Element UI 官方文档。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值