vue中 计算结果NaN问题

Question

html: {{ this.starts }}

js:

     data() {
        return {
           seconds1: 86400,
           starts: (Date.parse(new Date()) / 1000) - Number(this.seconds1),
       
     

结果：NaN

请问为什么会是NaN?

Answer 1

给上面的回答做个补充:

你的用法相当于

var a = {
    time : 1,
    count : a.time + 1
}

这个表达式做了什么:首先声明a变量,然后声明一个对象,赋值time,count属性,最后是把对象赋值给a标量,这个顺序要搞明白,在赋值count属性的时候,a还是undefined,所以a.time会报错,那到你这里,就是this.seconds1还是undefined,所以结果是NaN

解决:提前声明一个变量保存该数据

data() {
    let seconds = 86400
    return {
       seconds1: seconds,
       starts: (Date.parse(new Date()) / 1000) - Number(seconds),

Answer 2

哪来的this.seconds1，vue之所以经常能看到很多地方可以通过this访问，是因为首先在初始化的时候把props/data/method合并到vm上，其次很多方法通过call/apply/bind把vm替换了原本的this

Answer 3

如楼上所说，是取不到的。可以在created中赋值。
created() {

this.starts= (Date.parse(new Date()) / 1000) - Number(this.seconds1);

}