352-rc-collapse 中文文档教程

发布于 8年前 浏览 20 项目主页 更新于 3年前

# rc-collapse

用于反应的 rc-collapse ui 组件

NPM 版本构建状态测试覆盖率npm download

Development

npm install
npm start

Example

http://localhost:8000/examples/

在线示例:http

Features

  • support ie8,ie8+,chrome,firefox,safari

Install

://react-component.github.io/collapse/ rc-collapse

Usage

var Collapse = require('rc-collapse');
var Panel = Collapse.Panel;
var React = require('react');
var ReactDOM = require('react-dom');
var collapse = (
  <Collapse accordion={true}>
    <Panel header="hello">this is panel content</Panel>
    <Panel header="title2">this is panel content2 or other</Panel>
  </Collapse>
);
ReactDOM.render(collapse, container);

API

Collapse

props:

nametypedefaultdescription
activeKeyArray|StringThe first panel keycurrent active Panel key
defaultActiveKeyArray|Stringnulldefault active key
accordionBooleanfalseaccordion mode, default is null, is collapse mode
onChangeFunction(key)noopcalled when collapse Panel is changed

如果手风琴 为 null 或 false,每个面板都可以打开。 打开另一个面板不会关闭任何其他面板 activeKey 应该是一个数组,一个字符串可以正常工作,activeKey 将是一个 数组,唯一的项目是提供的 activeKey 字符串。

如果 accordion 为真,则只能打开一个面板。 打开任何一个面板都会导致先前打开的面板关闭。 activeKey 应该是一个字符串,但也支持数组,只需使用第一个 物品。

Collapse.Panel

props

nametypedefaultdescription
headerString or nodeheader content of Panel
showArrowbooleantrueshow arrow beside header
classNameString or objectcustom className to apply
styleobjectcustom style

key

如果未提供 key,将使用面板的索引。

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/dir

License

rc-collapse 是在 MIT 许可证下发布的。

# rc-collapse

rc-collapse ui component for react

NPM versionbuild statusTest coveragenpm download

Development

npm install
npm start

Example

http://localhost:8000/examples/

online example: http://react-component.github.io/collapse/

Features

  • support ie8,ie8+,chrome,firefox,safari

Install

rc-collapse

Usage

var Collapse = require('rc-collapse');
var Panel = Collapse.Panel;
var React = require('react');
var ReactDOM = require('react-dom');
var collapse = (
  <Collapse accordion={true}>
    <Panel header="hello">this is panel content</Panel>
    <Panel header="title2">this is panel content2 or other</Panel>
  </Collapse>
);
ReactDOM.render(collapse, container);

API

Collapse

props:

nametypedefaultdescription
activeKeyArray|StringThe first panel keycurrent active Panel key
defaultActiveKeyArray|Stringnulldefault active key
accordionBooleanfalseaccordion mode, default is null, is collapse mode
onChangeFunction(key)noopcalled when collapse Panel is changed

If accordion is null or false, every panel can open. Opening another panel will not close any of the other panels activeKey should be an array, a string will work fine, activeKey will be an array, and the only item is the activeKey string provided.

If accordion is true, only one panel can be open. Opening any one panel will cause the previously opened panel to close. activeKey should be an string, but array is support too, just use the first item.

Collapse.Panel

props

nametypedefaultdescription
headerString or nodeheader content of Panel
showArrowbooleantrueshow arrow beside header
classNameString or objectcustom className to apply
styleobjectcustom style

key

If key is not provided, the panel's index will be used instead.

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/ dir

License

rc-collapse is released under the MIT license.

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文