iview DatePicker日期插件绑定v-modal值时 给的默认值日期是date类型问题

最新推荐文章于 2023-09-12 17:00:58 发布
最新推荐文章于 2023-09-12 17:00:58 发布
阅读量445 收藏
点赞数
文章标签： view design javascript 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lyz246859/article/details/130924886
版权

最近在使用iview开发pc项目时，因为很久没搞pc项目了，对iview组件有点陌生，所有在使用DatePicker日期插件的时候，绑定了v-modal值，但是又在页面开始阶段赋值了默认值，导致，在采用默认值的时候提交rq参数，会是rq从yyyy-MM-dd格式变成带区时的rq,造成报错，这是因为DatePicker日期插件的默认格式是deta格式，所有在提交rq值的时候，一定要把显示用的值和提交的值区分开，避免被自动转换了日期格式

lyz246859
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
iview组件之DatePicker日期格式,显示格式化，后台传值也格式化特定格式如（yyyy-MM-dd）
jieweiwujie的博客
12-07 792
其中on-change的作用就是把value值和format格式联系起来。value1的值就是format格式的。这样前台展示，和给后太传值都是固定格式字符串 "yyyy-MM-dd" 的格式，使用value替代model。
iview组件DatePicker type="datetimerange绑定初始默认时间值
weixin_30815427的博客
04-20 4118
使用::value="[this.startTime,this.endTime]"，绑定当天时间 如下： <DatePicker type="datetimerange" placeholder="Select date" style="width: 100%" @on-change="changeTime" :value="...
iview - 日期选择控件datePicker格式
热门推荐
idomyway的博客
05-21 1万+
前言     iview日期选择控件少一天问题         在时间控件中明明选择的是2019-05-21,但是当通过vue的调试器查看的时候，竟然是这样的     写法如下 <FormItem label="开始时间" prop...
前端开发VUE使用iView的DatePicker 设置默认值
03-02
我们在用Vue做前端时，经常会用到iView的UI控件，比如说日期选择器就是比较常用的。官方文档都提供了源码，但未提供设置默认值的代码。所以就得我们自己开看控件说明自己编写实现。本文档就是说明怎么在使用iView 的DatePicker控件时自己设置想要的默认值。
经验笔记 - 03_iView DatePicker组件数据回显日期格式错误
文泽路小男孩的博客
10-12 1790
java.text.ParseException: Unparseable date: "Tue Sep 20 2022 00:00:00 GMT+0800(中国标准时间)"
iview DatePicker 组件时间转换
weixin_38310495的博客
12-02 1417
<date-picker type="datetime" format="yyyy-MM-dd HH:MM:dd" v-model="contractEffectiveDate" placeholder="Select date" @on-change="item.contractEffectiveDate=$event"></date-picker>
uView框架中DatetimePicker选择器设置默认值
weixin_69666355的博客
06-25 4663
uview的文档有个defaultIndex属性设置各列的默认索引，但是使用发现无效果。需求是页面显示的哪天日期 点开就是哪天的日期。解决方案：使用innerValue。2.在点击显示日期弹框的地方使用。1.给选择器添加ref。
Vue iView DatePicker时间组件踩坑
weixin_44794123的博客
06-28 1922
iView时间组件：DatePicker封装使用
iview日期控件,双向绑定日期格式的方法
01-19
日期在双向绑定之后格式为：2017-07-03T16:00:00.000Z 想要的格式为2017-07-04 调了好久，几乎一天：用一句话搞定了 @on-change=”addForm.Birthday=$event” <Date placeholder=选择日期 type=datetime v-model=...
vue组件中iview的modal组件爬坑问题之modal的显示与否应该是使用v-show
10-17
主要介绍了vue组件中iview的modal组件爬坑问题之modal的显示与否应该是使用v-show,本文通过实例图文相结合的形式给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
Vue element 日期获取展示今天日期
最新发布
seimeii的博客
09-12 245
Vue element 日期获取展示今天日期
【vue】iview组件 DatePicker 日期选择器如何显示默认当前日期
阿杰
10-20 1万+
为了方便用户体验，上头要求日期选择应该给一个默认的日期，查了查iview的官网，发现没有写，就自己找了一个办法 代码 html <DatePicker class="dpt_font" v-model="meetingDate.meetingDate" format="yyyy/MM/dd" type="date" :options="options" placeholder="选择时间" ...
iView 中DatePicker日期选择器 v-model不生效的情况
TestingShare
02-23 1046
iView 时间选择器 样式库使用问题
iview日期控件双向绑定日期格式的方法 不会提示错误
weixin_43784341的博客
04-19 400
将v-model换成:value和on-change事件可解决日期选择器少8小时的问题 <Date-picker type="date" placeholder="选择日期" :value="templateForm.applyDateLimit" :disabled="bOnlyRead" :options="optionsDate" @on-change="templateForm.applyDateLimit=$
IView 保存时候日期选择器少8个小时解决方法
mashibao521126的博客
05-24 632
IView 保存时候日期选择器少8个小时解决方法 将v-model换成:value和on-change事件可解决日期选择器少8小时的问题 <FormItem prop="content3"> <DatePicker :value="formData.content3" @on-change="formData.content3=$event" :options="options1" format="yyyy年MM月dd日 HH
iview DatePicker添加表单验证、初始化赋值、选择器额外配置
HuangsTing的博客
03-26 1602
<Form class="search_form" ref="searchForm" :rules="ruleInline" :model="formInline" label-position="right" :label-width="80"> <FormItem prop="searchTime" label="查询时间"> <DatePicker ...
iview中DatePicker双向绑定重新赋值后,表单必选日期验证失败
zhongqing1995的博客
01-11 744
iview中DatePicker双向绑定重新赋值后,表单必选日期验证失败 例: <Form ref="InsertReimInvoiceItemBo" :model="InsertReimInvoiceItemBo" :rules="InsertValidate" :label-width="80" > <Row> <Col span="12"> <FormI
iview踩坑日记（一）——DatePicker
小罗伯特
11-02 1152
DatePicker解决坑
ivew的日期选择器使用v-model绑定参数时需要注意什么
06-10
在iView的日期选择器中，使用`v-model`绑定日期参数时需要注意以下几点： 1. `v-model`绑定的值应该是一个JavaScript的日期对象，而非字符串或数字类型的日期。例如：`new Date('2022-02-22')`。 2. `v-model`绑定的值必须是双向绑定的。这意味着，如果你想要在日期选择器中选择一个新的日期，绑定的值必须更新。 3. 如果你希望输入框中显示的日期格式与你的应用程序中使用的日期格式不同，可以通过设置`format`属性来指定日期格式。 4. 如果你的应用程序需要处理不同的时区或本地化问题，你需要相应地调整`v-model`绑定的日期对象。 例如，下面的代码演示了如何在iView的日期选择器中使用`v-model`绑定日期参数： ```html <template> <DatePicker v-model="selectedDate" type="date" format="yyyy-MM-dd"></DatePicker> </template> <script> export default { data() { return { selectedDate: new Date('2022-02-22') } } } </script> ``` 在这个例子中，我们将`selectedDate`绑定到日期选择器的`v-model`上，并且将日期格式设置为`yyyy-MM-dd`。当用户在日期选择器中选择一个新的日期时，`selectedDate`将会自动更新。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值