此组件一般用于显示一根线条,用于分隔内容块,有横向和竖向两种模式,且能设置0.5px线条,使用也很简单。
#平台差异说明
App(vue) | App(nvue) | H5 | 小程序 |
√ | √ | √ | √ |
#基本使用
组件内部有预置的参数,直接使用即可,有如下几个参数需要了解:
color
为线条的颜色direction
为线条的方向,默认为横向length
参数需要特别留意,它需要带上单位,比如设置为"50%","500rpx"等,在线条为横向时,表现为线条的长度;在线条为竖向时,表现为线条的高度。
<template> /* 基础使用 */ <u-line></u-line> /* 自定义颜色 */ <u-line color="#2979ff"></u-line> /* 自定义线条方向 */ <u-line direction="col"></u-line> /* 自定义线条长度 */ <u-line length="50%"></u-line> </template>
copy
#是否虚线
dashed
控制线条是否虚线:
<template> <u-line dashed></u-line> </template>