react项目实战学习笔记-学习18-app布局

import React, { Component, Fragment, useState } from "react";

import { Button } from 'antd';
import { Outlet } from 'react-router-dom'
import { Layout } from 'antd';
import logoImg from "./assets/logo.png"
// import Header from './components/Header'
// import Sider from './components/Aside'
// import Bread from './components/Bread'
const {Sider,Content}=Layout
function App() {
  return (
    <Layout id='app'>
     <header>
      <img src={logoImg} alt="" className="logo"></img>
     </header>
     <Layout>
      <Sider>sider</Sider>
      <Content>
        <div>
          <Outlet></Outlet>
        </div>
      </Content>
     </Layout>
      <footer>Respect | Copyright &copy; 2022 歌谣</footer>
    </Layout>
  )
}
export default App;

posted @ 2022-08-20 21:55  前端导师歌谣  阅读(45)  评论(0)    收藏  举报