Ant Design moment对象和字符串之间的相互转化教程

moment对象转字符串

values.saleStartTime=values.saleStartTime.format('YYYY-MM-DD');

字符串转moment对象

this.model.saleStartTime=moment(record.saleStartTime);

补充知识：vue ant design 的日期组件range-picker表单中进行moment赋值问题

官方文档这样写

参数 说明 类型
showTime.defaultValue 设置用户选择日期时默认的时分秒 moment[]

之前进行过普通票哪个的datepicker赋值

区别是range-picker是将两个日期存成了moment[]类型的数组

这个就比较操蛋了，后台不想拆成2个字段，只好把它转成字符串

formData.showDate = formData.showDate.join(',')

然而，再拿回来转成数组去赋值，不行……

具体原因找了好久才对比出来，原因不说了，看一下正确的流程

formData.showDate = [ formData.showDate[0].toISOString() , formData.showDate[1].toISOString() ];

formData.showDate = formData.showDate.join(',')

然后赋值就是正常赋值：

this.model.showDate?this.model.showDate= [moment(this.model.showDate[0], 'YYYY-MM-DD HH:mm:ss'), moment(this.model.showDate[1], 'YYYY-MM-DD HH:mm:ss')]:null

this.form.setFieldsValue({ showDate: this.model.showDate ? this.model.showDate : null })

以上这篇Ant Design moment对象和字符串之间的相互转化教程就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 基于ant design日期控件使用_仅月份的操作

    总体效果: 展开后: 选值后: 代码部分: 1.引入: import { DatePicker } from 'antd'; 2.主体部分: export default class PersonInfo extends Component{ constructor() { super(); //设置状态,存储日期 this.state = { workMode: ['month', 'month'], workValue: [], }; } render(){ //主体引用 const {Ra

  • Ant Design的Table组件去除

    在Ant Design的Table组件文档中,排序有三种状态:点击升序.点击降序.取消排序.一般需求只需要升序和降序,不需要取消排序,这时候就需要我们设置sortOrder来去除取消排序. 首先,我们从官方文档中ctrl+c出一个排序栗子,放在我们的组件中. 官方栗子 import React, { useEffect, useState } from 'react'; import { Table } from 'antd' export default () => { const [data

  • ant-design-vue 时间选择器赋值默认时间的操作

    我就废话不多说了,大家还是直接看代码吧~ <template> <div> <a-range-picker show-time format="YYYY/MM/DD HH:mm:ss" :value="[this.moment(startTime, dateFormat),this.moment(endTime, dateFormat)]" //关键代码 @change="onChangeTime" ><

  • Ant design vue table 单击行选中 勾选checkbox教程

    最近了解Ant design 设计table 单击行选中checkedbox功能,相比于element的 @row-click 再触发toggleRowSelection,ant design的api就没那么清晰了,言归正传 期望:Ant design table 单击行选中 勾选checkedbox 实现: 单选: onClickRow(record) { return { on: { click: () => { let keys = []; keys.push(record.id); th

  • 解决ant design vue中树形控件defaultExpandAll设置无效的问题

    页面步骤: 1.设置a-tree标签 2.默认的treeNodes值设置为空数组 3.在mounted组件加载的时候给treeNodes的值赋值 结果: 设置defaultExpandAll无效,并不能展开所有节点 原因: defaultExpandAll 仅在组件第一次渲染时有效,不仅仅tree组件,其它组件的defaultXXX值都是这个行为, 可以自行搜索受控组件/非受控组件的概念.如果你想异步获取数据后展开全部结点,可以使用非受控方式: https://codepen.io/lovefe

  • ant design 日期格式化的实现

    今天写项目的时候用到ant design中的日期组件,但是由于用ant design日期组件取得的值是moment类型,而往数据库中保存需要的是字符串类型.这里就用到了moment日期转换 第一种写法 我取得的值是年月 如:201806 第二种写法 moment().format('YYYY-MM-DD') 第三种写法 moment(Date.now()).format('YYYY-MM-DD') 获取本地日期的下个月 window.moment().add(1, 'months') 获取当前日

  • ant-design表单处理和常用方法及自定义验证操作

    首先要说一下antdesign这个框架API和demo丰富,而且开发环境提供对应的warning来纠正用户的错误.是一个很好的组件库. 关于表单验证方面是依赖于 async-validator 库.百度的san-xui组件库的表单验证也是依赖与async-validator.说明这个库的实用性还是比较高,可以多了解一下. 首先按照antDesign官网Demo.我们可以copy一个Form表单的demo. LoginForm是表单的组件,下面代码,是React 高阶组件(Hoc). 用于使组件获

  • ant design vue中日期选择框混合时间选择器的用法说明

    首先时间格式化用到moment方法,需要在页面中引入moment组件 import moment from 'moment' 结构代码: <a-date-picker style="width:100%" :getCalendarContainer="(triggerNode) => triggerNode.parentNode" format="YYYY-MM-DD HH:mm:ss" v-decorator="[ 'pu

  • Ant Design moment对象和字符串之间的相互转化教程

    moment对象转字符串 values.saleStartTime=values.saleStartTime.format('YYYY-MM-DD'); 字符串转moment对象 this.model.saleStartTime=moment(record.saleStartTime); 补充知识:vue ant design 的日期组件range-picker表单中进行moment赋值问题 官方文档这样写 参数 说明 类型 showTime.defaultValue 设置用户选择日期时默认的时

  • 基于jQuery对象和DOM对象和字符串之间的转化实例

    1.字符串---------->jQuery对象 $(HTML字符串): $('<div>我是祖国的一朵小花</div>') 待添加列表 2.jQuery对象---------->DOM对象 下标选取法(原理:jQuery是DOM的数组形式):$("h2")[1] 使用.get(index)函数 3.字符串----------->DOM对象 写一个脚本函数 function parseDom(nodelist) { //nodelist是htm

  • JS对象和字符串之间互换操作实例分析

    JS对象和字符串之间互换操作实例分析

    本文实例讲述了JS对象和字符串之间互换操作.分享给大家供大家参考,具体如下: 平时在工作中大家一定也有过这样的需求,就是有时候需要把一个json对象转换为字符串,有时候要把一个类似json对象的字符串转换为json对象,那么今天就来总结一下,js的方法 1. json对象转字符串 这个API很简单就是 JSON.stringify() ,只需要把你要转换的对象写到括号里就行了,下面有一个小demo let json = { msg:"json转字符串", name:"前端林三

  • 谈谈JSON对象和字符串之间的相互转换JSON.stringify(obj)和JSON.parse(string)

    在Firefox,chrome,opera,safari,ie9,ie8等高级浏览器直接可以用JSON对象的stringify()和parse()方法. JSON.stringify(obj)将JSON转为字符串.JSON.parse(string)将字符串转为JSON格式: var a={"name":"tom","sex":"男","age":"24"}; var aToStr =

  • 解析JSON对象与字符串之间的相互转换

    在开发的过程中,如果对于少量参数的前后台传递,可以直接采用ajax的data函数,按json格式传递,后台Request即可,但有的时候,需要传递多个参数,这样后台 接受的时候Request多个很麻烦,此时要按照类的格式或者 集合的形式进行传递. 例如:前台按类的格式传递JSON对象: var jsonUserInfo = "{\"TUserName\":\"" + userName + "\",\"TInterest\&qu

  • js中json对象和字符串的理解及相互转化操作实现方法

    本文实例讲述了js中json对象和字符串的理解及相互转化操作实现方法.分享给大家供大家参考,具体如下: <script> var str="{'strv':["+ "{'a':'a11'},"+ " {'a':'b222'}"+ " ]}"; //如果放在一行更清楚:var str="{'strv':[{'a':'a11'}, {'a':'b222'} ]}"; var str2=eval('(

  • FastJson对于JSON格式字符串、JSON对象及JavaBean之间的相互转换操作

    FastJson对于JSON格式字符串、JSON对象及JavaBean之间的相互转换操作

    fastJson对于json格式字符串的解析主要用到了一下三个类: JSON:fastJson的解析器,用于JSON格式字符串与JSON对象及javaBean之间的转换. JSONObject:fastJson提供的json对象. JSONArray:fastJson提供json数组对象. 我们可以把JSONObject当成一个Map<String,Object>来看,只是JSONObject提供了更为丰富便捷的方法,方便我们对于对象属性的操作.我们看一下源码. 同样我们可以把JSONArra

  • ant design vue的form表单取值方法

    ant design vue的form表单取值方法

    目录 ant design vue的form表单取值 官方中有以下两种取值方式 ant design of vue 学习之表单form v-decorator(表单验证,内置绑定,初始值) 数据获取与填充 表单实例 ant design vue的form表单取值 官方中有以下两种取值方式 因为不是很熟悉,所以还是查了文档找了一下使用方式,刚开始查到的文档是这样写的 然后返回了undefined,后来又查询了一些文档,发现我多加了一个props属性,然后使用第二个方法成功了,代码如下: ant d

  • JS中JSON对象和String之间的互转及处理技巧

    JSON:JavaScript 对象表示法(JavaScript Object Notation),其实JSON就是一个JavaScript的对象(Object)而已. 如有不清楚JSON,可以去w3cschool了解http://www.w3school.com.cn/json/ 1.在javascript中新建一个字符串(JSON文本). var txt = '{ "employees" : [' + '{ "firstName":"Bill"

随机推荐