vue中对日期格式化为“年/月/日”的方法(适应chrome语言设置为中文和英文)

1、浏览器语言仅适合中文的

代码很简单,一句话搞定

function dataFormat(time) {
  return new Date(time).toLocaleDateString();
  //
}

2、浏览器语言适合中文和英文的

function dataFormat(time) {
  var d = new Date(time);
  var curr_date = d.getDate();
  var curr_month = d.getMonth() + 1;
  var curr_year = d.getFullYear();
  var h = d.getHours(); //获取小时
  var m = d.getMinutes(); //获取分钟
  var s = d.getSeconds(); //获取秒
  String(curr_month).length < 2 ? (curr_month = "0" + curr_month) : curr_month;
  String(curr_date).length < 2 ? (curr_date = "0" + curr_date) : curr_date;
  String(h).length < 2 ? (h = "0" + h) : h;
  String(m).length < 2 ? (m = "0" + m) : m;
  String(s).length < 2 ? (s = "0" + s) : s;
  var timeformat = curr_year + "/" + curr_month + "/" + curr_date ;// YY:MM:DD
  return timeformat;
};

讨论:为什么要设置适合两种语言的?
假设今天是 2020/7/8
1、如果浏览器使用英文Language,则默认日期格式:7/8/2020
2、如果浏览器使用中文Language,则默认日期格式:2020/7/8
后端如果对要传的日期格式进行限定的话(只能传 年月日 这种格式),我们就需要采用第二种方法进行处理,第一种方式的话无法转换。
当然,这不是唯一方法,仅供参考。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 在Vue, 使用JavaScriptDate()对象获取当前期, 使用Date.prototype.toISOString()方法转换成"yyyy-MM-dd"格式。 当前期: ``` var date = new Date(); var today = date.toISOString().substring(0,10); ``` 三天后的期: ``` var threeDaysLater = new Date(date.getTime() + 3 * 24 * 60 * 60 * 1000); var threeDaysLaterFormat = threeDaysLater.toISOString().substring(0,10); ``` 可以将代码放入Vue的computed计算属性, 以便在模板访问。 ### 回答2: 在Vue获取当前期以及三天后的期,可以使用JavaScriptDate对象和一些期操作方法来实现。 首先,在Vue组件,可以通过在`data`定义一个期的变量来保存当前期和三天后的期,例如: ``` data() { return { currentDate: '', // 当前期 futureDate: '', // 三天后的期 } }, ``` 然后,在`created`钩子函数,可以使用JavaScriptDate对象来获取当前期和三天后的期,然后将它们格式化为"yyyy-MM-dd"的格式,再赋值给相应的变量,例如: ``` created() { const today = new Date(); // 获取当前期 this.currentDate = this.formatDate(today); // 格式化为"yyyy-MM-dd" const future = new Date(); future.setDate(today.getDate() + 3); // 获取三天后的期 this.futureDate = this.formatDate(future); // 格式化为"yyyy-MM-dd" }, methods: { formatDate(date) { const year = date.getFullYear(); // 获取份 const month = date.getMonth() + 1; // 获取份 const day = date.getDate(); // 获取期 // 对份和期进行补零处理 const formattedMonth = month < 10 ? `0${month}` : month.toString(); const formattedDay = day < 10 ? `0${day}` : day.toString(); return `${year}-${formattedMonth}-${formattedDay}`; // 返回格式化后的期 } } ``` 最后,在Vue模板,可以通过双向绑定来显示当前期和三天后的期,例如: ``` <template> <div> <p>当前期:{{ currentDate }}</p> <p>三天后的期:{{ futureDate }}</p> </div> </template> ``` 这样,在Vue渲染页面时,就会显示当前期和三天后的期了。 ### 回答3: 在Vue,可以通过使用moment库来获取当前期和三天后的期。首先,需要在项目安装moment库。 ```shell npm install moment --save ``` 然后,在需要获取期的组件,引入moment库,并使用方法来获取当前期和三天后的期。 ```javascript import moment from 'moment'; export default { data() { return { currentDate: '', threeDaysLater: '' }; }, mounted() { this.currentDate = moment().format('YYYY-MM-DD'); this.threeDaysLater = moment().add(3, 'days').format('YYYY-MM-DD'); } }; ``` 上述代码,通过调用moment()方法可以创建一个表示当前期和时间的moment对象。然后,使用format('YYYY-MM-DD')方法日期格式化为"yyyy-MM-dd"的格式。 针对三天后的期,可以通过调用add(3, 'days')方法,在当前期的基础上加上3天。 最后,在Vue,通过将这两个期存储在data的变量,就可以在模板使用它们了。 ```html <template> <div> <p>当前期: {{ currentDate }}</p> <p>三天后的期: {{ threeDaysLater }}</p> </div> </template> ``` 这样就可以在模板显示当前期和三天后的期了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值