zent
Version:
一套前端设计语言和基于React的实现
49 lines (43 loc) • 907 B
Markdown
order: 3
zh-CN:
title: 类型为 breadcrumb 的步骤条
stepOneText: 登录有赞账号
stepTwoText: 选择门店
stepThreeText: 绑定门店
stepFourText: 完成
en-US:
title: Steps of breadcrumb type
stepOneText: Sign in to Youzan
stepTwoText: Choose a store
stepThreeText: Bind the store
stepFourText: Finish
```jsx
import { Steps } from 'zent';
class StepsExample extends Component {
state = {
current: 1
}
onStepChange = (id) => {
this.setState({
current: id
});
}
render() {
let { current } = this.state;
return (
<Steps current={current} type="breadcrumb" onStepChange={this.onStepChange} >
<Steps.Step title="{i18n.stepOneText}" />
<Steps.Step title="{i18n.stepTwoText}" />
<Steps.Step title="{i18n.stepThreeText}" />
<Steps.Step title="{i18n.stepFourText}" />
</Steps>
);
}
}
ReactDOM.render(
<StepsExample />,
mountNode
);
```