创建“文本”节点后:
const text = new Konva.Text({
x: stage.width() / 2,
y: stage.height() / 2,
width: 200,
fontSize: 30,
height: 30,
fill: 'green',
text: 'Simple text'
});
其中 height 值等于 fontSize 值,则函数stage.toJSON()
不返回 height 参数:
[object Object] {
attrs: [object Object] { ... },
children: [[object Object] {
attrs: [object Object] { ... },
children: [[object Object] {
attrs: [object Object] {
fill: "green",
fontSize: 30,
text: "Simple text",
width: 200
},
className: "Text"
}],
className: "Layer"
}],
className: "Stage"
}
这是一个jsbin:http://jsbin.com/hikobiceji/1/edit?html,js,console
但是如果高度和 fontSize 不相等:
const text = new Konva.Text({
x: stage.width() / 2,
y: stage.height() / 2,
width: 200,
fontSize: 30,
height: 30.01,
fill: 'green',
text: 'Simple text'
});
然后出现 height 参数:
[object Object] {
attrs: [object Object] { ... },
children: [[object Object] {
attrs: [object Object] { ... },
children: [[object Object] {
attrs: [object Object] {
fill: "green",
fontSize: 30,
height: 30.01,
text: "Simple text",
width: 200
},
className: "Text"
}],
className: "Layer"
}],
className: "Stage"
}
答案 0 :(得分:2)
这是Konva
序列化的内部逻辑。 Konva
试图使JSON尽可能小。因此,它不包括属性的默认值。
如果将文本放在一行中,则文本的高度将等于其字体大小。在您的情况下,默认的getter返回30
。由于它等于您使用的值,因此Konva会跳过它。