属性“WebkitBoxOrient”的类型不兼容

Question

这有什么问题？

if (isClampSupported) {
  const clampStyling = {
    display: '-webkit-box',
    WebkitLineClamp: lines,
    WebkitBoxOrient: 'vertical',
    overflow: 'hidden',
    textOverflow: 'ellipsis',
  };
  return (
    <div style={clampStyling}>{children}</div>
  )
}

style= 呈红色波浪状，显示：

键入'{显示：字符串； WebkitLineClamp：编号 |不明确的; WebkitBoxOrient：字符串；溢出：字符串；文本溢出：字符串； }' 不可分配给类型 'Properties'。 属性“WebkitBoxOrient”的类型不兼容。 类型 'string' 不可分配给类型 'BoxOrient |未定义'.ts(2322) index.d.ts(1841, 9)：预期的类型来自属性 'style'，它在类型 'DetailedHTMLProps' 上声明 (JSX 属性) HTMLAttributes.style?: React.CSSProperties |未定义

如何解决？

如果我将其更改为小写 webkitBoxOrient，它会在控制台中记录一条警告：

警告：不支持供应商前缀样式属性 webkitBoxOrient。你是说 WebkitBoxOrient 吗？

Answer 1

尝试像内联样式一样：

if (isClampSupported) {
  return (
    <div style={{
    display: '-webkit-box',
    WebkitLineClamp: lines,
    WebkitBoxOrient: 'vertical',
    overflow: 'hidden',
    textOverflow: 'ellipsis',
  }}>{children}</div>
  );
}