精华内容
下载资源
问答
  • vue 时间格式转换

    2021-05-31 15:04:53
    <p>HH:mm:ss转换成HH:mm 后端返回的时间是12:00:00,现在只要12:00要怎么转换</p>
  • C#+Vue时间格式转换

    2021-05-23 12:59:10
    某天甲方给我们提了个要求,如图: 于是我们写成了这样 FCSTDeliverydate = Convert....楞了一会,我还以为是时间格式转换转错了,就把数据重新debug了一遍,结果发现数据库中的数据是数字格式,后台查出来的数据也是数

    某天甲方给我们提了个要求,如图:

    于是我们写成了这样

    FCSTDeliverydate = Convert.ToDateTime(par.FCSTDeliverydate).ToString("yyyy-MM-dd")
    //SQLSugar中的一句话

    按理说应该是没问题的,但是这个Bug再一次被提了出来,如图:

    说是要求月份不允许英文显示,时间格式整个显示为数字

    楞了一会,我还以为是时间格式转换转错了,就把数据重新debug了一遍,结果发现数据库中的数据是数字格式,后台查出来的数据也是数字格式,接口在前台吐出来的数据也是数字格式,在页面上显示的也是数字格式,都没问题啊,结果到了甲方那边就诡异的变成了英文格式;闹了半天,最后才发现是因为他们那边的电脑是英文系统所以显示时间格式变成了英文的了(瞬间心中一万只草泥马奔腾而过);

    翻翻找找,最后找到了DateTimeFormatInfo.InvariantInfo这么个方法,貌似是可以屏蔽系统时间显示格式,写了进去;

    FCSTDeliverydate = Convert.ToDateTime(par.FCSTDeliverydate).ToString("yyyy-MM-dd",DateTimeFormatInfo.InvariantInfo)

    但是没有用,调试的时候在浏览器上报500错误,页面加载不出来,搞了半天也不知道为啥;

    然后我又写成了这样:

    FCSTDeliverydate = (par.FCSTDeliverydate.Value.Year + "-" + par.FCSTDeliverydate.Value.Month + "-" + par.FCSTDeliverydate.Value.Day).ToString(),

    这回倒是不报错了,但是到了甲方那边又变成了英文格式;

    后来还是从同事的模块中找到了一个方法,在vue前台处理了一下日期

    <template>

    <el-table-column prop="finalTime"
                     label="FinalTime"
                     :formatter="dateFormat" //这个方法
                     sortable>
    </el-table-column>

    <script>

    dateFormat(row, column) {
                    debugger;
                    let data = row[column.property]
                    if (data == null || data == '' || data == undefined) {
                        return '';
                    }
                    let dt = new Date(data);
                    return dt.getFullYear() + '-' + (dt.getMonth() + 1) + '-' + dt.getDate();
                },

    但是到了那个显示诡异的页面发现表格字段太多,所以表头是循环出来的,直接写进去好像不太彳亍

     

    <el-table ref="mainTable" border id="out-table"
                              height="100%"
                              :key="tableKey"
                              :data="list"
                              v-loading="listLoading"
                              fit
                              highlight-current-row
                              style="width: 100%"
                              @row-click="rowClick"
                              @selection-change="handleSelectionChange">
                        <template v-for="(headerItem, index) in headerList">
                            <el-table-column :label="headerItem.description"
                                             min-width="120px"
                                             :key="index"
                                             show-overflow-tooltip>
                                <!--:formatter="dateFormat()"-->//因为不好使给拿到外面注掉了
                                <template slot-scope="scope">
                                    <span>{{ scope.row[headerItem.key] }}</span>
                                </template>
                            </el-table-column>
                        </template>
    
    
                    </el-table>

    既然写道这里面不好使,那就干脆给你在初始化界面的时候就给你转换了吧,于是就在页面加载时请求后台然后返回数据的时候就直接调用了一下这个方法

    //请求后台
    costreport.getList(this.listQuery).then((response) => {
                        this.list = response.data;
                        var  dateFormat = this.dateFormat
                        console.log(this.list);
                        debugger;
                        this.list.forEach(item => {
                            item.FinalTime = dateFormat(item.FinalTime)
                            item.fcstDeliverydate = dateFormat(item.fcstDeliverydate)
                        })
    }),
    
    //处理数据
    
    dateFormat(value) {
    
                    let data = value
                    if (data == null) {
                        return ''
                    }
                    let dt = new Date(data)
                    return dt.getFullYear() + '-' + (dt.getMonth() + 1) + '-' + dt.getDate()
    
                },

    结果接口吐出来的值是正确的,到了这个处理日期的方法里面就变成了Invalid date

    然后在后台代码又加了一句话,变成了这样;

    FCSTDeliverydate=string.IsNullOrEmpty(par.FCSTDeliverydate.ToString())?"":DateTime.Parse(par.FCSTDeliverydate.ToString()).ToString("yyyy-MM-dd")

    到此为止接口返回数据正常,数据处理正常,页面显示正常

    废了这么大劲,也不知道到了甲方那边好不好使,要是还不好使的话,就只能建议他换电脑了;

     

    我是爱敲代码的冬马和纱,刚入行的大专实习生程序员,在CSDN记录自己学习与成长的一点一滴,希望我的经验也能对大家有所帮助,谢谢;

    展开全文
  • Vue时间戳格式转换

    2018-05-17 17:34:12
    数据库是Datetime类型或者date或者timestamp类型在vue页面显示的是时间戳的数字那么解决办法:/** * 创建时间 */ @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss") private Date createTime;在entity...

    数据库是Datetime类型或者date或者timestamp类型

    在vue页面显示的是时间戳的数字

    那么解决办法:

    /**
    	 * 创建时间
    	 */
    	@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
    	private Date createTime;

    在entity中添加JsonFormat注解,

    就行了,我之前还傻乎乎的去页面转换

    展开全文
  • vue时间格式转换

    千次阅读 2020-12-30 11:57:03
    //时间转换 Vue.filter('dateFormat', function (originVal) { const dt = new Date(originVal) const y = dt.getFullYear() const m = (dt.getMonth() + 1 + '').padStart(2, '0') const d = (dt.getDate() + '')....

    在写项目中,一般会调用接口,调用接口返回来的时间是一串数字,那么如何处理这些数字呢?
    在这里插入图片描述

    一、在main.js中引入

    //时间转换
    Vue.filter('dateFormat', function (originVal) {
    const dt = new Date(originVal)
    const y = dt.getFullYear()
    const m = (dt.getMonth() + 1 + '').padStart(2, '0')
    const d = (dt.getDate() + '').padStart(2, '0')
    const hh = (dt.getHours() + '').padStart(2, '0')
    const mm = (dt.getMinutes() + '').padStart(2, '0')
    const ss = (dt.getSeconds() + '').padStart(2, '0')
    return `${y}.${m}.${d} ${hh}:${mm}:${ss}`
    })
    

    二、在组件中
    在这里插入图片描述
    然后去浏览器看看
    在这里插入图片描述
    发现都是NaN,然后去查找资料

    发现:接口返回的数据是String类型的,需要转换成Number类型

    在这里插入图片描述
    再去浏览器look look
    在这里插入图片描述
    看到时间转换过来了,但是又发现时间对不上,然后查资料

    如果接口返回的数字一共有10位,需要x1000,如果是13位的话,就直接用

    在这里插入图片描述
    浏览器看效果
    在这里插入图片描述
    然后时间就转换成功了,OK!

    展开全文
  • 主要介绍了vue获取时间戳转换日期格式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
  • Vue时间格式转换

    2021-01-08 10:14:24
    时间格式转换 SimpleDateFormat .js export default class SimpleDateFormat { constructor(pattern) { this.pattern = pattern; } pattern = "yyyy_MM_dd HH:mm:ss"; parse = function (source) { try { ...

    Vue时间格式的转换

    引入 SimpleDateFormat .js

    import SimpleDateFormat from “/js/SimpleDateFormat.js”;

    export default class SimpleDateFormat {
    
      constructor(pattern) {
        this.pattern = pattern;
      }
      pattern = "yyyy_MM_dd HH:mm:ss";
      parse = function (source) {
        try {
          return new Date(source);
        } catch (e) {
          console.log("字符串 " + source + " 转时间格式失败!");
          return null;
        }
      };
    
      format = function (date) {
        if (typeof (date) == "undefined" || date == null || date == "") {
          return "";
        }
    
        try {
          date = new Date(date);
        } catch (e) {
          console.log("时间 " + date + " 格式化失败!");
          return "";
        }
    
        var strTime = this.pattern;
        var o = {
          "M+": date.getMonth() + 1, //月份 
          "d+": date.getDate(), //日 
          "H+": date.getHours(), //小时 
          "m+": date.getMinutes(), //分 
          "s+": date.getSeconds(), //秒 
          "q+": Math.floor((date.getMonth() + 3) / 3), 
          "S": date.getMilliseconds()
        };
    
        if (/(y+)/.test(strTime)) {
          strTime = strTime
            .replace(RegExp.$1, (date.getFullYear() + "")
              .substr(4 - RegExp.$1.length));
        }
        for (var k in o) {
          if (new RegExp("(" + k + ")").test(strTime)) {
            strTime = strTime.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
          }
        }
    
        return strTime;
      };
    }
    

    转换成yyyy-MM-dd格式

     var dateSdf= new SimpleDateFormat("yyyy-MM-dd");
     this.time=dateSdf.format(this.time);//yyyy-MM-dd
    
    展开全文
  • vue获取时间戳转换日期格式

    万次阅读 2018-01-23 18:39:48
    vue获取时间戳转换日期格式。 方法一为转载黄轶老师的format方法:出处(黄轶老师github https://github.com/ustbhuangyi); // date.js export function formatDate (date, fmt) { if (/(y+)/.test(fmt)...
  • vue标准时间格式转换

    2020-12-17 14:46:36
    标准时间格式转换 转换时间格式为yyyy-MM-dd hh:mm:ss. formatDate(date,fmt){ let time = { 'M+': date.getMonth() + 1, 'd+': date.getDate(), 'h+': date.getHours(), 'm+': date.getMinutes(), 's+': ...
  • vue日期时间转换为年月日格式

    千次阅读 2020-08-19 16:59:58
    } 文本转换 text-indent 指定文本的第一行的缩进 font-family 设置文本的字体 font-size 设置文本的大小 line-height 行高 CSS 链接 - a:link - 正常,未访问过的链接 - a:visited - 用户已访问过的链接 - a:hover -...
  • 下面小编就为大家分享一篇vue将时间戳转换成自定义时间格式的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • vue中将日期转换为指定的格式

    千次阅读 2020-12-16 16:12:59
    vue中将日期转换为指定的格式: 方案一: 这个方法是我觉得特别好用的: 写一个转换日期的方法,直接使用就可以 //时间格式化函数,此处仅针对yyyy-MM-dd hh:mm:ss 的格式进行格式化 dateFormat:function(time) { ...
  • 解决vue项目中时间格式转换 刚开始写的时候是用这种方式转换的 // 时间格式转换 Vue.filter(‘dateFormat’, function (origin) { const newDate = new Date(origin); const n = newDate.getFullYear(); const y = ...
  • VUE-日期选择器-UTC时间格式转换

    千次阅读 2019-10-02 15:10:00
    VUE-日期选择器,返回的时间为UTC格式:Thu Oct 03 2019 00:00:00 GMT+0800 (中国标准时间),我们需要将UTC时间格式转换成我们需要的格式,例如:2019-09-30 05:12:30 ,或者:2019-09-30 代码展示: <label ...
  • vue将时间戳转换日期格式

    万次阅读 2018-08-23 16:53:05
    (1)创建一个处理时间格式的js,内容如下: export function formatDate(date, fmt) { if (/(y+)/.test(fmt)) { fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length)) } ...
  • vue 转换日期格式

    千次阅读 2018-09-11 16:48:00
    转换日期格式 设置过滤器  filters: {  formatDate(time) {  var date = new Date(time);  return formatDate(date, "yyyy-MM-dd");  }  }   使用方法 <span>{{item.buyTime|...
  • 第一种方法(固定格式转换): Date.prototype.toLocaleString = function () { // 重写日期函数格式日期 return `${this.getFullYear()}-${this.getMonth() + 1 >= 10 ? (this.getMonth() + 1) : '0' + (this...
  • 1.获取当前时间vuevar now=new Date(); //Tue Oct 17 2017 18:08:40 GMT+0800 (中国标准时间)npm获取当前时间日期ormnew Date().getDate() //17getnew Date().toLocaleString() //2017/10/17 下午6:08:40string2...
  • 安装 npm i moment --save引入 import moment from 'moment' 切记不要写在方法里!filters: { formatDate: function (value) { return moment(value).format('YYYY-MM-DD HH:MM:ss') } }, ...
  • Vue.filter('dateFormat', function(originVal) { const dt = new Date(originVal) const y = dt.getFullYear() const m = (dt.getMonth() + 1 + '').padStart(2, '0') const d = (dt.getDate() + '').padStart...
  • 既然是做系统,通常都离不开时间的装换,今天遇到的这个功能是做个`vue` 的 `formatDate 时间转换`的 `filter 过滤器` 需求如下: - 提前封装好`过滤器formatDate` - `data`里面定义 `date: new Date()` - 直接`...
  • vue日期格式处理

    千次阅读 2018-12-16 15:05:06
    项目开发中,由于后台返回的数据是时间戳,所以前台需要有一哥统一处理日期。 举例:后台返回时间戳:...Transfer将时间戳转换成Date类型,Format第一个参数为日期格式,第二个参数为可选,当日期为nul...
  • 话不多说,直接开始: {{time|timeList}} 利用过滤器转换每一个时间戳

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 27,381
精华内容 10,952
关键字:

vue时间格式转换

vue 订阅