Javascript React Native-如何在两个单词之间创建一条动态虚线（引线）？

我在React Native中有一个组件，它只显示如下信息列表：

Device: Macbook
Port: 8080
OS: Darwin

但是，我希望显示如下文本：

Device.........Macbook
Port..............8080
OS..............Darwin

考虑到大多数手机屏幕的尺寸可能不同，我如何实现这条虚线，使其动态地符合手机的尺寸，并且看起来很漂亮/不会溢出到flexbox中的下一行？

尝试添加borderRadius

尝试添加边界半径

<View style={{
    borderStyle: 'dotted',
    borderWidth: 1,
    borderRadius: 1,
  }}>
</View>