@alicloud/console-components/esm/rc/breadcrumb/demos/demo2.js

Alibaba Cloud React Components

/* eslint-disable no-script-url */
/**
 * title: "超长字段/隐藏字段"
 * description: "通过设置maxNode属性设置最多显示字段，超出省略。"
 */
import React from 'react';
import { Breadcrumb } from '@alicloud/console-components';
var spanStyle = {
    display: 'inline-block',
    width: '160px',
    textOverflow: 'ellipsis',
    overflow: 'hidden',
};
export default function Demo2() {
    return (React.createElement(React.Fragment, null,
        React.createElement(Breadcrumb, { maxNode: 5 },
            React.createElement(Breadcrumb.Item, { link: "javascript:void(0)" }, "\u65E0\u5F71\u4E91\u7535\u8111"),
            React.createElement(Breadcrumb.Item, { link: "javascript:void(0)" },
                React.createElement("span", { style: spanStyle }, "\u7528\u6237\u4E0E\u7BA1\u7406\u5458\u540D\u79F0\u5B9E\u4F8B\u7BA1\u7406\u7528\u6237\u4E0E\u7BA1\u7406\u5458\u540D\u79F0\u5B9E\u4F8B\u7BA1\u7406")),
            React.createElement(Breadcrumb.Item, { link: "javascript:void(0)" }, "\u7EC4\u7EC7ID"),
            React.createElement(Breadcrumb.Item, { link: "javascript:void(0)" }, "\u7EC4\u7EC7ID"),
            React.createElement(Breadcrumb.Item, null, "\u7B56\u7565")),
        React.createElement("br", null),
        React.createElement(Breadcrumb, { maxNode: 5 },
            React.createElement(Breadcrumb.Item, { link: "javascript:void(0)" }, "\u65E0\u5F71\u4E91\u7535\u8111"),
            React.createElement(Breadcrumb.Item, { link: "javascript:void(0)" }, "\u7528\u6237\u4E0E\u7BA1\u7406\u5458"),
            React.createElement(Breadcrumb.Item, { link: "javascript:void(0)" }, "\u7EC4\u7EC7ID"),
            React.createElement(Breadcrumb.Item, { link: "javascript:void(0)" }, "\u7EC4\u7EC7ID"),
            React.createElement(Breadcrumb.Item, { link: "javascript:void(0)" }, "\u7EC4\u7EC7ID"),
            React.createElement(Breadcrumb.Item, null, "\u7B56\u7565"))));
}