ant design 初体验02布局

落日映苍穹つ 2021-09-19 16:22 271阅读 0赞

import React, { Component } from 'react';
    import { Menu, Icon } from 'antd';
    import { Layout, Breadcrumb } from 'antd';
    import './HeadNav.css';
    
    const { Header, Content, Footer } = Layout;
    
    export default class HeadNav extends Component {
        state = {
            current: 'home',
        }
        render() {
            return (
                <Layout className="layout">
                    <Header>
                        <div className="logo" />
                        <Menu
                            theme="dark"
                            mode="horizontal"
                            defaultSelectedKeys={['2']}
                            style={
       { lineHeight: '64px' }}
                        >
                            <Menu.Item key="1">nav 1</Menu.Item>
                            <Menu.Item key="2">nav 2</Menu.Item>
                            <Menu.Item key="3">nav 3</Menu.Item>
                        </Menu>
                    </Header>
                </Layout>
            )
        }
    
    }

需要demo可以加群下载836383650

发表评论取消回复

表情：

评论列表（有 0 条评论，271人围观）

还没有评论，来说两句吧...

相关阅读

相关 Ant Design入门

目录一：什么是Ant Design？二：开始使用三：布局四：表格 -------------------- 一：什么是Ant Design？ Ant

不念不忘少年蓝@/ 2024年03月30日 12:40/ 0 赞/ 91 阅读

相关 JavaScript||瀑布流布局初体验

瀑布流是什么瀑布流，又称瀑布流式布局，是比较流行的一种网站页面布局。瀑布流的主要特质是：定宽而不定高；视觉表现为参差不齐的多栏布局。最早采用此布局的网站是

快来打我*/ 2023年03月13日 03:52/ 0 赞/ 5 阅读

相关 React note14（hook&typescript初体验&ts与react&Ant Design）

Hook -------------------- Hook概念 React Hooks是React 16.8.0版本推出的新特性，主要的作用就是让无状态组件可以

曾经终败给现在/ 2022年12月01日 11:43/ 0 赞/ 309 阅读

相关 Ant Design Vue 使用-引入 ant-design-vue并且使用

Ant Design Vue 是使用 Vue 实现的遵循 Ant Design 设计规范的高质量 UI 组件库，用于开发和服务于企业级中后台产品。 Ant Design Vu

布满荆棘的人生/ 2022年09月06日 10:19/ 0 赞/ 570 阅读

相关 React--ant design

Reactjs入门参考路径：[http://www.cnblogs.com/Leo\_wl/p/4489197.html][http_www.cnblogs.com_Leo_w

分手后的思念是犯贱/ 2022年07月13日 05:41/ 0 赞/ 250 阅读

相关 Ant Design笔记1——

ant design是蚂蚁金服基于react构建的一个框架，这个框架用来快速搭建前端应用、提升反应效率，很有帮助。 ant design官网：[https://ant.des

小鱼儿/ 2022年05月13日 19:08/ 0 赞/ 214 阅读

相关启动 Ant Design 项目

在Ant Design项目项目名目录下打开cmd窗口，输入npm start 命令，即可启动Ant Design项目。 ![70][] [70]: /images/

比眉伴天荒/ 2022年05月08日 08:42/ 0 赞/ 440 阅读

相关 Ant Design引入Echarts

目录 1.首先在Ant Design项目上安装echarts相关的包 2.在项目里就可以引入相关的包了 3.示例代码 4. 运行结果 ----------------

绝地灬酷狼/ 2022年03月02日 10:50/ 0 赞/ 773 阅读

相关 ant design 初体验02布局

import React, { Component } from 'react'; import { Menu, Icon } from 'antd';

落日映苍穹つ/ 2021年09月19日 16:22/ 0 赞/ 272 阅读

相关 ant desgin 使用记录【一.初体验】

mkdir xm_shop cd xm_shop yarn create umi ![watermark_type_ZmFuZ3p

拼搏现实的明天。/ 2021年09月18日 16:58/ 0 赞/ 250 阅读