react pdf中显示异常行为的样式

Question

我正在尝试在react pdf中使用斜体样式。

在我使用font-style: italic;之前，一切都很好。

在react pdf中，有没有其他样式的文本如斜体？

const Italic = styled.Text`
font-size: 12px;
lineheight: 20px;
text-align: left;
font-family: "Roboto Condensed";
letter-spacing: 0.5px;
font-style: italic;//problem is with this line
font-weight:400;
`;

它给了我一个错误：

未捕获(承诺中(错误：无法解析未定义的字体，fontWeight 400

Answer 1

注册字体时，需要确保为要使用的每个fontStyle都包含一个变体。例如：

Font.register({
family: 'Roboto',
fonts: [
{ src: '<path-to-normal-font-variant>' },
{ src: '<path-to-italic-font-variant>', fontStyle: 'italic' },
...
]
});

Answer 2

const Italic = styled.Text`
font-size: "12px";
lineheight: "20px";
text-align: left;
font-family: "Roboto Condensed";
letter-spacing: "0.5px";
font-style: "italic";//problem is with this line
font-weight:400;
`;

在任何情况下，后缀px都需要单引号或双引号，字体样式：value(italic(也需要双引号。