Javascript 更改画布宽度/高度时，画布上下文将重置

如果我设置

ctx.textb基线=“top”

，但随后调整画布的大小，

ctx.textbreeline

将更改回

“字母”

。这是预期的行为吗？这个问题困扰了我一段时间，所以我很好奇。发生在Chrome和Firefox中，所以我初步猜测这是预期的行为

//text基线不工作：
设ctx1=canvas1.getContext（“2d”）；
ctx1.textBaseline=“顶部”；
画布1.宽度=31；
画布1.高度=31；
ctx1.fillText（“hi”，10，10）；
//固定的：
设ctx2=canvas2.getContext（“2d”）；
canvas2.width=31；
画布2.高度=31；
ctx2.textBaseline=“顶部”// 这似乎确实是指定的行为。参见的定义。当HTMLCanvasElement本身的宽度或高度属性更改时，将调用重置CanvasRenderingContext2D对象状态的算法：

当用户代理将位图尺寸设置为宽度和高度时，它必须运行以下步骤：

将渲染上下文重置为其默认状态

[……]

画布上下文的“状态”也被明确定义，并且
textbeline
被列为构成其状态的属性之一。它也是。
Ahh，所以整个上下文都被重置了！谢谢我应该测试ctx的其他属性：
// textBaseline not working:
let ctx1 = canvas1.getContext("2d");
ctx1.textBaseline = "top";
canvas1.width = 31;
canvas1.height = 31;
ctx1.fillText("hi", 10, 10);

// fixed:
let ctx2 = canvas2.getContext("2d");
canvas2.width = 31;
canvas2.height = 31;
ctx2.textBaseline = "top"; // <-- need to set it *after* resize to get it to work
ctx2.fillText("hi", 10, 10);