From 6c2bc371ff4be8735592f9281d233ffdcfd5b1f8 Mon Sep 17 00:00:00 2001 From: SleepyAries <410100498@qq.com> Date: Wed, 18 Mar 2020 10:17:29 +0800 Subject: [PATCH] Add: add code demo for label --- src/router/widgetrouter.js | 32 +++++++---- src/router/widgets.js | 2 +- src/widgets/label/BasicLabel.js | 14 +++++ src/widgets/label/PrefixLabel.js | 12 ++++ src/widgets/label/StyleLabel.js | 54 ++++++++++++++++++ src/widgets/label/TextLabel.js | 12 ++++ src/widgets/label/config.js | 18 ++++++ src/widgets/label/index.js | 98 ++++++++++++++++++++++++++++++++ 8 files changed, 230 insertions(+), 12 deletions(-) create mode 100644 src/widgets/label/BasicLabel.js create mode 100644 src/widgets/label/PrefixLabel.js create mode 100644 src/widgets/label/StyleLabel.js create mode 100644 src/widgets/label/TextLabel.js create mode 100644 src/widgets/label/config.js create mode 100644 src/widgets/label/index.js diff --git a/src/router/widgetrouter.js b/src/router/widgetrouter.js index 0a36b34c..2ae2acd1 100644 --- a/src/router/widgetrouter.js +++ b/src/router/widgetrouter.js @@ -409,10 +409,20 @@ export default { return import('../widgets/collapse'); }, }, + '/component/label': + { + value: '/component/label', + sort: 76, + text: 'Label 文本', + exact: true, + render: async () => { + return import('../widgets/label'); + }, + }, '/component/popover': { value: '/component/popover', - sort: 76, + sort: 77, text: 'Popover 气泡卡片', exact: true, render: async () => { @@ -422,7 +432,7 @@ export default { '/component/table': { value: '/component/table', - sort: 77, + sort: 78, text: 'Table 表格', exact: true, render: async () => { @@ -432,7 +442,7 @@ export default { '/component/tabs': { value: '/component/tabs', - sort: 78, + sort: 79, text: 'Tabs 标签页', exact: true, render: async () => { @@ -442,7 +452,7 @@ export default { '/component/tag': { value: '/component/tag', - sort: 79, + sort: 80, text: 'Tag 标签', exact: true, render: async () => { @@ -452,7 +462,7 @@ export default { '/component/timeline': { value: '/component/timeline', - sort: 80, + sort: 81, text: 'TimeLine 时间轴', exact: true, render: async () => { @@ -462,7 +472,7 @@ export default { '/component/tooltip': { value: '/component/tooltip', - sort: 81, + sort: 82, text: 'Tooltip 文字提示', exact: true, render: async () => { @@ -472,7 +482,7 @@ export default { '/component/breadcrumb': { value: '/component/breadcrumb', - sort: 82, + sort: 83, text: 'Breadcrumb 面包屑', exact: true, render: async () => { @@ -482,7 +492,7 @@ export default { '/component/button': { value: '/component/button', - sort: 83, + sort: 84, text: 'Button 按钮', exact: true, render: async () => { @@ -492,7 +502,7 @@ export default { '/component/icon': { value: '/component/icon', - sort: 84, + sort: 85, text: 'Icon 图标', exact: true, render: async () => { @@ -502,7 +512,7 @@ export default { '/component/grid': { value: '/component/grid', - sort: 85, + sort: 86, text: 'Grid 栅格', exact: true, render: async () => { @@ -512,7 +522,7 @@ export default { '/component/layout': { value: '/component/layout', - sort: 86, + sort: 87, text: 'Layout 布局', exact: true, render: async () => { diff --git a/src/router/widgets.js b/src/router/widgets.js index 7d56ae62..c226b7c3 100644 --- a/src/router/widgets.js +++ b/src/router/widgets.js @@ -1 +1 @@ -export default [{"text":"导航","category":"导航","describe":true,"children":[{"widgetName":"Affix","sort":35,"floderName":"affix","value":"/component/affix","text":"Affix 固钉"},{"widgetName":"Navmenu","sort":36,"floderName":"navmenu","value":"/component/navmenu","text":"Navmenu 导航菜单"},{"widgetName":"Pagination","sort":37,"floderName":"pagination","value":"/component/pagination","text":"Pagination 分页"},{"widgetName":"Steps","sort":38,"floderName":"steps","value":"/component/steps","text":"Steps 步骤条"}]},{"text":"反馈","category":"反馈","describe":true,"children":[{"widgetName":"Alert","sort":39,"floderName":"alert","value":"/component/alert","text":"Alert 警告提示"},{"widgetName":"Drawer","sort":40,"floderName":"drawer","value":"/component/drawer","text":"Drawer 抽屉"},{"widgetName":"Message","sort":41,"floderName":"message","value":"/component/message","text":"Message 全局提示"},{"widgetName":"Modal","sort":42,"floderName":"modal","value":"/component/modal","text":"Modal 对话框"},{"widgetName":"Notification","sort":43,"floderName":"notification","value":"/component/notification","text":"Notification 通知提醒框"},{"widgetName":"Popconfirm","sort":44,"floderName":"popconfirm","value":"/component/popconfirm","text":"Popconfirm 气泡确认框"},{"widgetName":"Progress","sort":45,"floderName":"progress","value":"/component/progress","text":"Progress 进度条"},{"widgetName":"Skeleton","sort":46,"floderName":"skeleton","value":"/component/skeleton","text":"Skeleton 加载占位符"}]},{"text":"数据录入","category":"数据录入","describe":true,"children":[{"widgetName":"AmountInput","sort":47,"floderName":"amount-input","value":"/component/amountinput","text":"AmountInput 金额输入框"},{"widgetName":"AutoComplete","sort":48,"floderName":"auto-complete","value":"/component/autocomplete","text":"AutoComplete 自动完成"},{"widgetName":"Cascader","sort":49,"floderName":"cascader","value":"/component/cascader","text":"Cascader 级联选择"},{"widgetName":"Checkbox","sort":50,"floderName":"checkbox","value":"/component/checkbox","text":"Checkbox 多选框"},{"widgetName":"DatePicker","sort":51,"floderName":"date-picker","value":"/component/datepicker","text":"DatePicker 日期选择器"},{"widgetName":"Dropmenu","sort":52,"floderName":"dropmenu","value":"/component/dropmenu","text":"Dropmenu 下拉菜单"},{"widgetName":"Input","sort":53,"floderName":"input","value":"/component/input","text":"Input 文本输入框"},{"widgetName":"Menu","sort":54,"floderName":"menu","value":"/component/menu","text":"Menu 菜单"},{"widgetName":"NumberInput","sort":55,"floderName":"number-input","value":"/component/numberinput","text":"NumberInput 数字输入框"},{"widgetName":"Radio","sort":56,"floderName":"radio","value":"/component/radio","text":"Radio 单选框"},{"widgetName":"Rate","sort":57,"floderName":"rate","value":"/component/rate","text":"Rate 评分"},{"widgetName":"Select","sort":58,"floderName":"select","value":"/component/select","text":"Select 选择器"},{"widgetName":"Slider","sort":59,"floderName":"slider","value":"/component/slider","text":"Slider 滑动输入条"},{"widgetName":"Switch","sort":60,"floderName":"switch","value":"/component/switch","text":"Switch 开关"},{"widgetName":"TimePicker","sort":61,"floderName":"time-picker","value":"/component/timepicker","text":"TimePicker 时间选择器"},{"widgetName":"Transfer","sort":62,"floderName":"transfer","value":"/component/transfer","text":"Transfer 穿梭框"},{"widgetName":"Tree","sort":63,"floderName":"tree","value":"/component/tree","text":"Tree 树形控件"},{"widgetName":"TreeSelect","sort":64,"floderName":"tree-select","value":"/component/treeselect","text":"TreeSelect 树形选择控件"},{"widgetName":"Upload","sort":65,"floderName":"upload","value":"/component/upload","text":"Upload 上传"},{"widgetName":"Window","sort":66,"floderName":"window","value":"/component/window","text":"Window 窗体"}]},{"text":"其他","category":"其他","describe":true,"children":[{"widgetName":"Anchor","sort":67,"floderName":"anchor","value":"/component/anchor","text":"Anchor 锚点"},{"widgetName":"BackTop","sort":68,"floderName":"back-top","value":"/component/backtop","text":"BackTop 回到顶部"},{"widgetName":"Divider","sort":69,"floderName":"divider","value":"/component/divider","text":"Divider 分割线"},{"widgetName":"Loading","sort":70,"floderName":"loading","value":"/component/loading","text":"Loading 加载中"}]},{"text":"数据展示","category":"数据展示","describe":true,"children":[{"widgetName":"Avatar","sort":71,"floderName":"avatar","value":"/component/avatar","text":"Avatar 头像"},{"widgetName":"Badge","sort":72,"floderName":"badge","value":"/component/badge","text":"Badge 徽标数"},{"widgetName":"Card","sort":73,"floderName":"card","value":"/component/card","text":"Card 卡片"},{"widgetName":"Carousel","sort":74,"floderName":"carousel","value":"/component/carousel","text":"Carousel 走马灯"},{"widgetName":"Collapse","sort":75,"floderName":"collapse","value":"/component/collapse","text":"Collapse 折叠面板"},{"widgetName":"Popover","sort":76,"floderName":"popover","value":"/component/popover","text":"Popover 气泡卡片"},{"widgetName":"Table","sort":77,"floderName":"table","value":"/component/table","text":"Table 表格"},{"widgetName":"Tabs","sort":78,"floderName":"tabs","value":"/component/tabs","text":"Tabs 标签页"},{"widgetName":"Tag","sort":79,"floderName":"tag","value":"/component/tag","text":"Tag 标签"},{"widgetName":"TimeLine","sort":80,"floderName":"time-line","value":"/component/timeline","text":"TimeLine 时间轴"},{"widgetName":"Tooltip","sort":81,"floderName":"tooltip","value":"/component/tooltip","text":"Tooltip 文字提示"}]},{"text":"通用","category":"通用","describe":true,"children":[{"widgetName":"Breadcrumb","sort":82,"floderName":"breadcrumb","value":"/component/breadcrumb","text":"Breadcrumb 面包屑"},{"widgetName":"Button","sort":83,"floderName":"button","value":"/component/button","text":"Button 按钮"},{"widgetName":"Icon","sort":84,"floderName":"icon","value":"/component/icon","text":"Icon 图标"}]},{"text":"布局","category":"布局","describe":true,"children":[{"widgetName":"Grid","sort":85,"floderName":"grid","value":"/component/grid","text":"Grid 栅格"},{"widgetName":"Layout","sort":86,"floderName":"layout","value":"/component/layout","text":"Layout 布局"}]}] \ No newline at end of file +export default [{"text":"导航","category":"导航","describe":true,"children":[{"widgetName":"Affix","sort":35,"floderName":"affix","value":"/component/affix","text":"Affix 固钉"},{"widgetName":"Navmenu","sort":36,"floderName":"navmenu","value":"/component/navmenu","text":"Navmenu 导航菜单"},{"widgetName":"Pagination","sort":37,"floderName":"pagination","value":"/component/pagination","text":"Pagination 分页"},{"widgetName":"Steps","sort":38,"floderName":"steps","value":"/component/steps","text":"Steps 步骤条"}]},{"text":"反馈","category":"反馈","describe":true,"children":[{"widgetName":"Alert","sort":39,"floderName":"alert","value":"/component/alert","text":"Alert 警告提示"},{"widgetName":"Drawer","sort":40,"floderName":"drawer","value":"/component/drawer","text":"Drawer 抽屉"},{"widgetName":"Message","sort":41,"floderName":"message","value":"/component/message","text":"Message 全局提示"},{"widgetName":"Modal","sort":42,"floderName":"modal","value":"/component/modal","text":"Modal 对话框"},{"widgetName":"Notification","sort":43,"floderName":"notification","value":"/component/notification","text":"Notification 通知提醒框"},{"widgetName":"Popconfirm","sort":44,"floderName":"popconfirm","value":"/component/popconfirm","text":"Popconfirm 气泡确认框"},{"widgetName":"Progress","sort":45,"floderName":"progress","value":"/component/progress","text":"Progress 进度条"},{"widgetName":"Skeleton","sort":46,"floderName":"skeleton","value":"/component/skeleton","text":"Skeleton 加载占位符"}]},{"text":"数据录入","category":"数据录入","describe":true,"children":[{"widgetName":"AmountInput","sort":47,"floderName":"amount-input","value":"/component/amountinput","text":"AmountInput 金额输入框"},{"widgetName":"AutoComplete","sort":48,"floderName":"auto-complete","value":"/component/autocomplete","text":"AutoComplete 自动完成"},{"widgetName":"Cascader","sort":49,"floderName":"cascader","value":"/component/cascader","text":"Cascader 级联选择"},{"widgetName":"Checkbox","sort":50,"floderName":"checkbox","value":"/component/checkbox","text":"Checkbox 多选框"},{"widgetName":"DatePicker","sort":51,"floderName":"date-picker","value":"/component/datepicker","text":"DatePicker 日期选择器"},{"widgetName":"Dropmenu","sort":52,"floderName":"dropmenu","value":"/component/dropmenu","text":"Dropmenu 下拉菜单"},{"widgetName":"Input","sort":53,"floderName":"input","value":"/component/input","text":"Input 文本输入框"},{"widgetName":"Menu","sort":54,"floderName":"menu","value":"/component/menu","text":"Menu 菜单"},{"widgetName":"NumberInput","sort":55,"floderName":"number-input","value":"/component/numberinput","text":"NumberInput 数字输入框"},{"widgetName":"Radio","sort":56,"floderName":"radio","value":"/component/radio","text":"Radio 单选框"},{"widgetName":"Rate","sort":57,"floderName":"rate","value":"/component/rate","text":"Rate 评分"},{"widgetName":"Select","sort":58,"floderName":"select","value":"/component/select","text":"Select 选择器"},{"widgetName":"Slider","sort":59,"floderName":"slider","value":"/component/slider","text":"Slider 滑动输入条"},{"widgetName":"Switch","sort":60,"floderName":"switch","value":"/component/switch","text":"Switch 开关"},{"widgetName":"TimePicker","sort":61,"floderName":"time-picker","value":"/component/timepicker","text":"TimePicker 时间选择器"},{"widgetName":"Transfer","sort":62,"floderName":"transfer","value":"/component/transfer","text":"Transfer 穿梭框"},{"widgetName":"Tree","sort":63,"floderName":"tree","value":"/component/tree","text":"Tree 树形控件"},{"widgetName":"TreeSelect","sort":64,"floderName":"tree-select","value":"/component/treeselect","text":"TreeSelect 树形选择控件"},{"widgetName":"Upload","sort":65,"floderName":"upload","value":"/component/upload","text":"Upload 上传"},{"widgetName":"Window","sort":66,"floderName":"window","value":"/component/window","text":"Window 窗体"}]},{"text":"其他","category":"其他","describe":true,"children":[{"widgetName":"Anchor","sort":67,"floderName":"anchor","value":"/component/anchor","text":"Anchor 锚点"},{"widgetName":"BackTop","sort":68,"floderName":"back-top","value":"/component/backtop","text":"BackTop 回到顶部"},{"widgetName":"Divider","sort":69,"floderName":"divider","value":"/component/divider","text":"Divider 分割线"},{"widgetName":"Loading","sort":70,"floderName":"loading","value":"/component/loading","text":"Loading 加载中"}]},{"text":"数据展示","category":"数据展示","describe":true,"children":[{"widgetName":"Avatar","sort":71,"floderName":"avatar","value":"/component/avatar","text":"Avatar 头像"},{"widgetName":"Badge","sort":72,"floderName":"badge","value":"/component/badge","text":"Badge 徽标数"},{"widgetName":"Card","sort":73,"floderName":"card","value":"/component/card","text":"Card 卡片"},{"widgetName":"Carousel","sort":74,"floderName":"carousel","value":"/component/carousel","text":"Carousel 走马灯"},{"widgetName":"Collapse","sort":75,"floderName":"collapse","value":"/component/collapse","text":"Collapse 折叠面板"},{"widgetName":"Label","sort":76,"floderName":"label","value":"/component/label","text":"Label 文本"},{"widgetName":"Popover","sort":77,"floderName":"popover","value":"/component/popover","text":"Popover 气泡卡片"},{"widgetName":"Table","sort":78,"floderName":"table","value":"/component/table","text":"Table 表格"},{"widgetName":"Tabs","sort":79,"floderName":"tabs","value":"/component/tabs","text":"Tabs 标签页"},{"widgetName":"Tag","sort":80,"floderName":"tag","value":"/component/tag","text":"Tag 标签"},{"widgetName":"TimeLine","sort":81,"floderName":"time-line","value":"/component/timeline","text":"TimeLine 时间轴"},{"widgetName":"Tooltip","sort":82,"floderName":"tooltip","value":"/component/tooltip","text":"Tooltip 文字提示"}]},{"text":"通用","category":"通用","describe":true,"children":[{"widgetName":"Breadcrumb","sort":83,"floderName":"breadcrumb","value":"/component/breadcrumb","text":"Breadcrumb 面包屑"},{"widgetName":"Button","sort":84,"floderName":"button","value":"/component/button","text":"Button 按钮"},{"widgetName":"Icon","sort":85,"floderName":"icon","value":"/component/icon","text":"Icon 图标"}]},{"text":"布局","category":"布局","describe":true,"children":[{"widgetName":"Grid","sort":86,"floderName":"grid","value":"/component/grid","text":"Grid 栅格"},{"widgetName":"Layout","sort":87,"floderName":"layout","value":"/component/layout","text":"Layout 布局"}]}] \ No newline at end of file diff --git a/src/widgets/label/BasicLabel.js b/src/widgets/label/BasicLabel.js new file mode 100644 index 00000000..bd948c62 --- /dev/null +++ b/src/widgets/label/BasicLabel.js @@ -0,0 +1,14 @@ +import React from "react"; +import { Label } from "@lugia/lugia-web"; + +export default class BasicLabel extends React.Component { + + render() { + return + + ; + } + onClick = () => { + console.log('clickLabel'); + } +} diff --git a/src/widgets/label/PrefixLabel.js b/src/widgets/label/PrefixLabel.js new file mode 100644 index 00000000..ab060683 --- /dev/null +++ b/src/widgets/label/PrefixLabel.js @@ -0,0 +1,12 @@ +import React from "react"; +import { Label } from "@lugia/lugia-web"; + +export default class PrefixLabel extends React.Component { + render() { + return + +

+ + ; + } +} diff --git a/src/widgets/label/StyleLabel.js b/src/widgets/label/StyleLabel.js new file mode 100644 index 00000000..fadc885e --- /dev/null +++ b/src/widgets/label/StyleLabel.js @@ -0,0 +1,54 @@ +import React from "react"; +import { Label ,Theme} from "@lugia/lugia-web"; +import Widget from "@lugia/lugia-web/dist/consts"; + +export default class PrefixLabel extends React.Component { + render() { + const config = { + [Widget.Label]: { + Container: { + normal: { + color: '#2d3c93', + font: { + weight: 'bold', + size: 20, + }, + margin: { + left: 30, + top: 10, + }, + padding: { + right: 10, + bottom: 10, + }, + border: { + left:{ + width:2, + style:'solid', + color:'#4d63ff' + } + }, + + }, + hover: { + color: '#ac3400', + cursor: 'pointer', + }, + }, + LabelPrefix: { + normal: { + color: 'red', + margin: { + right: 10, + left: 5 + }, + }, + }, + }, + }; + return + + + ; + } +} diff --git a/src/widgets/label/TextLabel.js b/src/widgets/label/TextLabel.js new file mode 100644 index 00000000..33da8af4 --- /dev/null +++ b/src/widgets/label/TextLabel.js @@ -0,0 +1,12 @@ +import React from "react"; +import { Label } from "@lugia/lugia-web"; + + +export default class TextLabel extends React.Component { + + render() { + return + ; + } +} diff --git a/src/widgets/label/config.js b/src/widgets/label/config.js new file mode 100644 index 00000000..1a625f3c --- /dev/null +++ b/src/widgets/label/config.js @@ -0,0 +1,18 @@ +module.exports = { + BasicLabel: { + title: "基础使用", + desc: "基础Label的用法" + }, + TextLabel: { + title: "传入text属性", + desc: "传入text属性的用法" + }, + PrefixLabel: { + title: "有前缀的文本组件", + desc: "有前缀的文本组件的用法" + }, + StyleLabel: { + title: "文本组件主题配置", + desc: "可支持配置的文本组件样式" + } +}; diff --git a/src/widgets/label/index.js b/src/widgets/label/index.js new file mode 100644 index 00000000..febc38a3 --- /dev/null +++ b/src/widgets/label/index.js @@ -0,0 +1,98 @@ +import React from "react"; +import { Anchor, Grid } from "@lugia/lugia-web"; +import EditTables from "../../edit-table"; +import FooterNav from "../../footer-nav"; +import PageNavHoC from "../../common/PageNavHoC"; +import widgetrouter from "../../router/widgetrouter"; +import LABEL from "@lugia/lugia-web/dist/label/lugia.label.zh-CN.json"; +import Demo from "../code-box"; +import Title from "../code-box/Title"; +const BasicLabel = require("./BasicLabel").default; +const TextLabel = require("./TextLabel").default; +const PrefixLabel = require("./PrefixLabel").default; +const StyleLabel = require("./StyleLabel").default; + +const { Link } = Anchor; +const { Row, Col } = Grid; + +export default PageNavHoC( + widgetrouter, + class ComDemo extends React.Component { + handleLinkClick = (e, href) => { + if (href) { + const name = href.slice(1); + const anchorElement = document.getElementById(name); + if (anchorElement) { + anchorElement.scrollIntoView({ block: "start", behavior: "smooth" }); + } + } + }; + + render() { + const { next, prev, isMobile = false } = this.props; + const span = isMobile ? 24 : 20; + const style = isMobile ? {} : { paddingRight: "50px" }; + return ( + + +
+ + <Demo + title={"基础使用"} + titleID={"label-0"} + code={ + <code>{`import React from \"react\";\nimport { Label } from \"@lugia/lugia-web\";\n\nexport default class BasicLabel extends React.Component<any, any> {\n\n render() {\n return <React.Fragment>\n <Label>这是一个文本组件</Label>\n </React.Fragment>;\n }\n}\n`}</code> + } + desc={"基础Label的用法"} + demo={<BasicLabel />} + ></Demo> + <Demo + title={"传入text属性"} + titleID={"label-1"} + code={ + <code>{`import React from \"react\";\nimport { Label } from \"@lugia/lugia-web\";\n\n\nexport default class TextLabel extends React.Component<any, any> {\n\n render() {\n return <React.Fragment>\n <Label text={\'这是一个传入text属性的文本组件\'}/>\n </React.Fragment>;\n }\n}\n`}</code> + } + desc={"传入text属性的用法"} + demo={<TextLabel />} + ></Demo> + <Demo + title={"有前缀的文本组件"} + titleID={"label-2"} + code={ + <code>{`import React from \"react\";\nimport { Label } from \"@lugia/lugia-web\";\n\nexport default class PrefixLabel extends React.Component<any, any> {\n render() {\n return <React.Fragment>\n <Label showPrefix prefix={\'*\'} >这是一个带前缀的文本组件</Label>\n <br/><br/>\n <Label showPrefix prefix={\'##\'} >这是一个带前缀的文本组件</Label>\n </React.Fragment>;\n }\n}\n`}</code> + } + desc={"有前缀的文本组件的用法"} + demo={<PrefixLabel />} + ></Demo> + <Demo + title={"文本组件主题配置"} + titleID={"label-3"} + code={ + <code>{`import React from \"react\";\nimport { Label ,Theme} from \"@lugia/lugia-web\";\nimport Widget from \"@lugia/lugia-web/dist/consts\";\n\nexport default class PrefixLabel extends React.Component<any, any> {\n render() {\n const config = {\n [Widget.Label]: {\n Container: {\n normal: {\n color: \'#2d3c93\',\n font: {\n weight: \'bold\',\n size: 20,\n },\n margin: {\n left: 30,\n top: 10,\n },\n padding: {\n right: 10,\n bottom: 10,\n },\n border: {\n left:{\n width:2,\n style:\'solid\',\n color:\'#4d63ff\'\n }\n },\n\n },\n hover: {\n color: \'#ac3400\',\n cursor: \'pointer\',\n },\n },\n LabelPrefix: {\n normal: {\n color: \'red\',\n margin: {\n right: 10,\n left: 5\n },\n },\n },\n },\n };\n return <Theme config={config}>\n <Label showPrefix prefix={\'*\'} >这是一个带前缀的文本组件</Label>\n\n </Theme>;\n }\n}\n`}</code> + } + desc={"可支持配置的文本组件样式"} + demo={<StyleLabel />} + ></Demo> + <EditTables dataSource={LABEL} /> + <FooterNav prev={prev} next={next} /> + </div> + </Col> + {!isMobile && ( + <Col span={4}> + <Anchor + slideType="line" + onClick={this.handleLinkClick} + useHref={false} + > + <Link title={"基础使用"} href={"#label-0"} /> + <Link title={"传入text属性"} href={"#label-1"} /> + <Link title={"有前缀的文本组件"} href={"#label-2"} /> + <Link title={"文本组件主题配置"} href={"#label-3"} /> + </Anchor> + </Col> + )} + </Row> + ); + } + } +);