如何使用 JavaScript 生成舒适的表单

问题描述 投票:0回答:1

我想使用 JavaScript 生成一个看起来很舒服的表单,如下所示

但是,我尝试

console.table
这样做,但它实际上生成了一个糟糕的表单。 我该如何解决这个问题?

export function showNodeVersion(metadata: Metadata[]): void {
    const current = getCurrent(metadata).slice(0, 9);
    const lts = getLTS(metadata).slice(0, 9);
    const craft = {
        Current: current.map(m => {
            return m.version;
        }),
        LTS: lts.map(m => {
            return m.version;
        })
    }
    console.table(craft)
}

javascript command-line-interface
1个回答
0
投票

console.table
可以生成一个类似于所示所需输出的表格,但有一些注意事项:

  • 数据需要作为对象数组提供,
  • 可以使用
    console.log
    ,
  • 的第二个参数以数组形式提供列标题
  • 左侧出现一个额外的列,显示数组索引值。
  • 列内容似乎以可变宽度字体(不是等宽字体)提供,并带有左对齐。

将以下内容复制并粘贴到浏览器控制台中,然后按 Enter 键查看输出(代码片段似乎不支持

console.table
)。

// 4 rows of dummy data:

const sep = /,\s*/;
const CURRENT = "21.4.0,  21.3.0, 21.2.0,  21.1.0"  .split(sep); 
const LTS =     "20.10.0, 20.9.0, 18.19.0, 18.18.2" .split(sep);

const table = [];
const nRows = 4;
for( let i = 0; i < nRows; ++ i) {
  table.push( {CURRENT: CURRENT[i], LTS: LTS[i]})
}

console.table( table, ["CURRENT", "LTS"]);

如果警告可以接受,您仍然需要为帖子所需输出中显示的四列创建表数据。

© www.soinside.com 2019 - 2024. All rights reserved.