tiny_whiteboard icon indicating copy to clipboard operation
tiny_whiteboard copied to clipboard

fix(视图): 修复空格导致Element宽度小于文字宽度。

Open Webb-L opened this issue 2 years ago • 0 comments

测试文字:

// 计算文本的实际渲染宽度
let textCheckEl = null
export const getTextActWidth = (text, style) => {
  if (!textCheckEl) {
    textCheckEl = document.createElement('div')
    textCheckEl.style.position = 'fixed'
    textCheckEl.style.left = '-99999px'
    document.body.appendChild(textCheckEl)
  }
  let { fontSize, fontFamily } =                                                        style
  textCheckEl.innerText = text
  textCheckEl.style.fontSize = fontSize + 'px'
  textCheckEl.style.fontFamily = fontFamily
  let { width } = textCheckEl.getBoundingClientRect()
  return width
}

wanglin2 github io_tiny_whiteboard_demo_

localhost_3000_tiny_whiteboard_demo_

Webb-L avatar Jan 09 '24 06:01 Webb-L