vue.js怎样将时间戳转化为日期格式

通过vuejs

filter实现将时间戳转换为自定义标准时间格式方法如下：

js代码

$()ready(function()

{

自定义filter名称为'time'

vuefilter('time',

value

格式为13位unix时间戳

10位unix时间戳可通过value1000转换为13位格式

function(value)

{

var

date

=

new

date(value);

y

=

dategetfullyear(),

m

=

dategetmonth()

+

1,

d

=

dategetdate(),

h

=

dategethours(),

i

=

dategetminutes(),

s

=

dategetseconds();

if

(m

<

10)

{

m

=

'0'

+

m;

}

if

(d

<

10)

{

d

=

'0'

+

d;

}

if

(h

<

10)

{

h

=

'0'

+

h;

}

if

(i

<

10)

{

i

=

'0'

+

i;

}

if

(s

<

10)

{

s

=

'0'

+

s;

}

获取时间格式

2017-01-03

10:13:48

//

var

t

=

y+'-'+m+'-'+d+'

'+h+':'+i+':'+s;

获取时间格式

2017-01-03

var

t

=

y

+

'-'

+

m

+

'-'

+

d;

return

t;

});)

};

html代码

在需要转换格式的位置使用名为time的vuejs

filter

{{tab2fb1

|

time}}

要实现每日阅读时间的功能，您可以使用Vuejs来创建一个简单的应用程序。以下是实现此功能的一些步骤：

创建一个Vue组件，用于显示每日阅读时间。这个组件应该包括一个计时器和一个记录已经阅读时间的变量。

在组件中添加一个开始/停止按钮，以便用户可以开始或停止计时器。

当用户点击开始按钮时，计时器应该开始运行，并且每秒钟更新已经阅读时间的变量。您可以使用Vue的计算属性来动态显示已经阅读的时间。

当用户点击停止按钮时，计时器应该停止，并且应该将已经阅读的时间保存到本地存储中，以便用户下一次访问应用程序时可以继续从上次停止的地方开始阅读。

在组件中添加一个重置按钮，以便用户可以重置已经阅读的时间和计时器。

如果需要，您可以使用Vue Router将阅读时间组件包含在一个页面中，并将其与其他页面链接。

这些步骤应该可以帮助您实现一个简单的每日阅读时间应用程序。当然，您还可以添加其他功能，如用户登录、记录阅读的书籍和页面等等。

关于过滤器的使用，这里简单介绍，并以时间函数的使用为案例进行描述：

新建文件filtersjs

语法：<any>{{表达式|过滤器}}</any>

//验证 是否是字母数字 0 1 2

export function checkPass(pass) {

    if (passlength < 6) {

        return 0;

    }

    var ls = 0;

    if (passmatch(/([a-z])+/)) {

        ls++;

    }

    if (passmatch(/([0-9])+/)) {

        ls++;

    }

    if (passmatch(/([A-Z])+/)) {

        ls++;

    }

    if (passmatch(/[^a-zA-Z0-9]+/)) {

        ls++;

    }

    return ls;

}

//

export function IdentityCodeValid(code) {

    var city={11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江 ",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北 ",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏 ",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门",91:"国外 "};

    var tip = "";

    var pass= true;

    if(!code || !/^\d{6}(18|19|20)\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/itest(code)){

        tip = "身份z号格式错误";

        pass = false;

    }

  else if(!city[codesubstr(0,2)]){

        tip = "地址编码错误";

        pass = false;

    }

    else{

        //18位身份z需要验证最后一位校验位

        if(codelength == 18){

            code = codesplit('');

            //∑(ai×Wi)(mod 11)

            //加权因子

            var factor = [ 7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2 ];

            //校验位

            var parity = [ 1, 0, 'X', 9, 8, 7, 6, 5, 4, 3, 2 ];

            var sum = 0;

            var ai = 0;

            var wi = 0;

            for (var i = 0; i < 17; i++)

            {

                ai = code[i];

                wi = factor[i];

                sum += ai wi;

            }

            var last = parity[sum % 11];

            if(parity[sum % 11] != code[17]){

                tip = "校验位错误";

                pass =false;

            }

        }

    }

    consolelog(tip)

    // if(!pass) alert(tip);

    return pass;

}

//时间戳转日期

export function timestampToTime(timestamp,type) {

    var date = new Date(timestamp 1000);//时间戳为10位需1000，时间戳为13位的话不需乘1000

    var Y = dategetFullYear() + '-';

    var M = (dategetMonth()+1 < 10 '0'+(dategetMonth()+1) : dategetMonth()+1) + '-';

    var D = dategetDate() <10 '0'+dategetDate()+ ' ' : dategetDate() + ' ';

    var h = dategetHours()<10 '0'+dategetHours()+ ':' : dategetHours() + ':';

    var m = dategetMinutes() <10 '0'+dategetMinutes()+ ':' : dategetMinutes() + ':';

    var s = dategetSeconds();

    if(type){

        if(s<10){

            return Y+M+D+h+m+'0'+s;

        }else{

            return Y+M+D+h+m+s;

        }

    }else{

        return Y+M+D;

    }

}

/

@name 校验正整数

/

export const integer = (str) => {

    let r = /^\+[1-9][0-9]$/;//正整数

    return rtest(str);

}

/

@name 校验数字带小数点

/

export const dotNumber = (str) => {

    let r = /^\+[1-9][0-9&]$/;//正整数

    return rtest(str);

}

两位小数 限制最大整数位

/

@name 保留正整数str，leg（值，保存位数）

/

export const numberInt = (str, leg) => {

    if( leg && strlength > leg ) {

        str = strslice( 0,leg );

    }

    let int = Number( parseInt(str))toString() != 'NaN'  || str == '' Number( parseInt(str))toString() : '';

    return int

}

/

@name 数字，保留两位小数 str，maxStr（值，最大值）

/

export const floatInt = (str,maxStr) => {

    let float = strmatch( /^\d(\\d{0,2})/g)[0]

    if( float > maxStr ) {

        float = ( float/10 )toString()match( /^\d(\\d{0,2})/g)[0]

    }

    return float

}

以上就是关于vue.js怎样将时间戳转化为日期格式全部的内容，包括:vue.js怎样将时间戳转化为日期格式、vue实现每日阅读时间、vue 时间过滤器的简单使用等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！