然而事实是,似乎我的需求前后端都让我一块写了,但flask确实没有什么值得我写或者能放到一块说的

JS如何获取当前时间

var newDate = new Date();  
display = <>检测时间: {newDate.toLocaleTimeString()}</>

Date()即可获得时间戳

Date – JavaScript | MDN (mozilla.org) 中我们可以看到他还有更多的转译方式,当然我们也可以直接设置一个时间

这个例子或许在我之后会有写作用

theBigDay = new Date("July 1, 1999");
sameAsBigDay = new Date();
sameAsBigDay.setTime(theBigDay.getTime());

TDesign 的表格内容如何显示颜色

这个架构确实是公开的,那我就拿来说了

我看到cell参数可以进行自定义渲染,其实这一步就基本上明了了

我自己写后端的话,传参时候直接传一个列表,代表颜色和内容

if(row[col.colKey][0]=="green"){
    return (
        <div style={{color: "#48c79c"}}>{row[col.colKey][1]} <CheckCircleIcon size="1em"/></div>
    )
}
else if(row[col.colKey][0]=="red"){
    return (
        <div style={{color: "#e34d59"}}>{row[col.colKey][1]} <CloseCircleIcon size="1em"/></div>
    )
}
else{
    return (
        <div>{row[col.colKey][1]} </div>
    )
}

这样就可以代表这个值的状态了

再次讨论 this 的指向问题 箭头函数

虽然就这么将就用确实没什么问题,但我觉得有必要搞懂箭头函数到底是咋用的

已经在各个地方看到祂无数的写法了

(param1, param2, …, paramN) => { statements }
(param1, param2, …, paramN) => expression
(singleParam) => { statements }
singleParam => { statements }
() => { statements }
aaa = () => { statements }
params => ({foo: bar})
(param1, param2, ...rest) => { statements }

真的,初见这玩意一头雾水

事实上可以理解为一种更短更简洁的函数,但aaa = () => { statements }这种方式给我感觉并没有任何简洁可言,我用祂的唯一原因就是他的this能指向类本身

继续看看祂的第二行例子,(param1, param2, …, paramN) => expression 这里的表达式,估摸着应该是语法糖,他等同于

(param1, param2, …, paramN) =>{ return expression; }

那么第四行的也应该是第三行的语法糖

这样一些很大的混乱的写法也能很好的解开了

例如这样的(mdn示例):

var simple = a => a > 15 ? 15 : a;
var sum = arr.reduce((a, b) => a + b);

关于箭头函数的this mdn是这样描述的

没有单独的this

在箭头函数出现之前,每一个新函数根据它是被如何调用的来定义这个函数的 this 值:

  • 如果该函数是一个构造函数,this 指针指向一个新的对象
  • 在严格模式下的函数调用下,this 指向undefined
  • 如果该函数是一个对象的方法,则它的 this 指针指向这个对象
  • 等等

This被证明是令人厌烦的面向对象风格的编程。

function Person() {
  // Person() 构造函数定义 `this`作为它自己的实例。
  this.age = 0;

  setInterval(function growUp() {
    // 在非严格模式,growUp() 函数定义 `this`作为全局对象,
    // 与在 Person() 构造函数中定义的 `this`并不相同。
    this.age++;
  }, 1000);
}

var p = new Person();

在 ECMAScript 3/5 中,通过将this值分配给封闭的变量,可以解决this问题。

function Person() {
  var that = this;
  that.age = 0;

  setInterval(function growUp() {
    // 回调引用的是`that`变量,其值是预期的对象。
    that.age++;
  }, 1000);
}

或者,可以创建绑定函数,以便将预先分配的this值传递到绑定的目标函数(上述示例中的growUp()函数)。

箭头函数不会创建自己的this,它只会从自己的作用域链的上一层继承 this。因此,在下面的代码中,传递给setInterval的函数内的this与封闭函数中的this值相同:

function Person(){
  this.age = 0;

  setInterval(() => {
    this.age++; // |this| 正确地指向 p 实例
  }, 1000);
}

var p = new Person();