实现文本单行显示，溢出文本用 ... 代替

效果

html区域

<!-- 搜索建议列表区域 -->
    <view class="sugg-list">
      <view class="sugg-item" v-for="(item,i) in searchResults" :key="i" @click="goToDetail(item.goods_id)">
        <text>{{ item.goods_name }}</text>
        <uni-icons type="forward" size="16"></uni-icons>
      </view>
    </view>

css区域

text {
      // 文字不允许换行（单行文本）
      white-space: nowrap;
      // 溢出文本部分隐藏
      overflow: hidden;
      // 文本溢出后，使用 ... 代替
      text-overflow: ellipsis;
      margin-left: 3px;
    }