next UI

# DescriptionList 描述列表

# 概述

成组展示多个只读字段，常见于详情页的信息展示。

# 代码示例

基本用法
基本用法，设置 col 属性，可以指定最多显示几列，默认为 3 列，详见 API。
标题
Macintosh：
麦金塔电脑，是苹果电脑其中一系列的个人电脑。Macintosh 是由 Macintosh 计划发起人 Jeff Raskin（杰夫·拉斯金）根据他最爱的苹果品种 McIntosh 命名，但为了避免与音频设备制造商麦金托什实验室（McIntosh Laboratory)的名字有冲突，他故意改变了字母的拼写。
Lisa：
Lisa 是一款具有划时代意义的电脑，可以说没有 Lisa 就没有 Macintosh（在Mac的开发早期，很多系统软件都是在Lisa上设计的）。她具有16位CPU，鼠标，硬盘，以及支持图形用户界面和多任务的操作系统。并且随机捆绑了7个商用软件。
Newton：
Apple Newton（牛顿），是世界上第一款掌上电脑（PDA），由苹果电脑公司于1993年开始制造，但是因为newton在市场上找不到其定位而需求量低而停止发展，并于1997年停止了生产。 
<template>
    <DescriptionList title="标题">
        <Description term="Macintosh：">
            麦金塔电脑，是苹果电脑其中一系列的个人电脑。Macintosh 是由 Macintosh 计划发起人 Jeff Raskin（杰夫·拉斯金）根据他最爱的苹果品种 McIntosh 命名，但为了避免与音频设备制造商麦金托什实验室（McIntosh Laboratory)的名字有冲突，他故意改变了字母的拼写。
        </Description>
        <Description term="Lisa：">
            Lisa 是一款具有划时代意义的电脑，可以说没有 Lisa 就没有 Macintosh（在Mac的开发早期，很多系统软件都是在Lisa上设计的）。她具有16位CPU，鼠标，硬盘，以及支持图形用户界面和多任务的操作系统。并且随机捆绑了7个商用软件。
        </Description>
        <Description term="Newton：">
            Apple Newton（牛顿），是世界上第一款掌上电脑（PDA），由苹果电脑公司于1993年开始制造，但是因为newton在市场上找不到其定位而需求量低而停止发展，并于1997年停止了生产。
        </Description>
  </DescriptionList>
</template>
<script>
    export default {

    }
</script>
Expand Copy
垂直型
设置属性 layout 为 vertical 可以显示为垂直型布局。
垂直型的列表标题与内容将上下排列。
标题
Macintosh：
麦金塔电脑，是苹果电脑其中一系列的个人电脑。Macintosh 是由 Macintosh 计划发起人 Jeff Raskin（杰夫·拉斯金）根据他最爱的苹果品种 McIntosh 命名，但为了避免与音频设备制造商麦金托什实验室（McIntosh Laboratory)的名字有冲突，他故意改变了字母的拼写。
Lisa：
Lisa 是一款具有划时代意义的电脑，可以说没有 Lisa 就没有 Macintosh（在Mac的开发早期，很多系统软件都是在Lisa上设计的）。她具有16位CPU，鼠标，硬盘，以及支持图形用户界面和多任务的操作系统。并且随机捆绑了7个商用软件。
Newton：
Apple Newton（牛顿），是世界上第一款掌上电脑（PDA），由苹果电脑公司于1993年开始制造，但是因为newton在市场上找不到其定位而需求量低而停止发展，并于1997年停止了生产。 
<template>
    <DescriptionList title="标题" layout="vertical">
        <Description term="Macintosh：">
            麦金塔电脑，是苹果电脑其中一系列的个人电脑。Macintosh 是由 Macintosh 计划发起人 Jeff Raskin（杰夫·拉斯金）根据他最爱的苹果品种 McIntosh 命名，但为了避免与音频设备制造商麦金托什实验室（McIntosh Laboratory)的名字有冲突，他故意改变了字母的拼写。
        </Description>
        <Description term="Lisa：">
            Lisa 是一款具有划时代意义的电脑，可以说没有 Lisa 就没有 Macintosh（在Mac的开发早期，很多系统软件都是在Lisa上设计的）。她具有16位CPU，鼠标，硬盘，以及支持图形用户界面和多任务的操作系统。并且随机捆绑了7个商用软件。
        </Description>
        <Description term="Newton：">
            Apple Newton（牛顿），是世界上第一款掌上电脑（PDA），由苹果电脑公司于1993年开始制造，但是因为newton在市场上找不到其定位而需求量低而停止发展，并于1997年停止了生产。
        </Description>
  </DescriptionList>
</template>
<script>
    export default {

    }
</script>
Expand Copy

# API

# DescriptionList props

属性 说明 类型 默认值
layout 布局方式，可选值为 horizontal 或 vertical String horizontal
title 列表标题 String -
gutter 列表项间距，单位为 px Number 32
col 指定信息最多分几列展示，最终一行几列由 col 配置结合响应式规则（见下表）决定，可选值为 1、2、3、4 Number 3

# 响应式规则

窗口宽度 展示列数
≥768px col
≥576px col < 2 ? col : 2
<576px 1

# DescriptionList Slots

名称 说明
title 自定义列标题
default 默认

# Description Props

属性 说明 类型 默认值
term 列表项标题 String -

# Description Slots

名称 说明
term 自定义列表项标题
default 默认

← 树选择 →