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

简介: 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 © 2022 歌谣</footer>
    </Layout>
  )
}
export default App;

image.png

相关文章
|
8月前
|
安全
第二轮学习笔记:三、APP抓包
第二轮学习笔记:三、APP抓包
64 0
|
5天前
|
Dart 前端开发 架构师
【01】vs-code如何配置flutter环境-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈-供大大的学习提升
【01】vs-code如何配置flutter环境-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈-供大大的学习提升
|
3月前
|
XML 前端开发 JavaScript
react学习笔记一:入门级小白到脚手架(create-react-app)开发项目
这篇文章是React的学习笔记,覆盖了从React的基础用法到高级特性,包括组件化、状态管理、生命周期、虚拟DOM等主题,适合React初学者参考。
125 0
react学习笔记一:入门级小白到脚手架(create-react-app)开发项目
|
5月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
140 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
6月前
|
Android开发 Kotlin
kotlin开发安卓app,如何让布局自适应系统传统导航和全面屏导航
使用`navigationBarsPadding()`修饰符实现界面自适应,自动处理底部导航栏的内边距,再加上`.padding(bottom = 10.dp)`设定内容与屏幕底部的距离,以完成全面的布局适配。示例代码采用Kotlin。
154 15
|
7月前
|
移动开发 前端开发 Java
技术笔记:ReactNative学习笔记(一)————(RN)快速入门
技术笔记:ReactNative学习笔记(一)————(RN)快速入门
89 0
|
8月前
|
监控 安全 Shell
深入探究App压力测试的关键要点:从零开始学习Monkey
Monkey是Google的自动化测试工具,用于模拟用户随机事件以测试应用的稳定性和压力。它可以在模拟器或设备上运行,通过随机点击发现潜在问题。
|
8月前
|
前端开发
React学习笔记(一)
React学习笔记(一)
|
8月前
|
前端开发
React学习笔记
React学习笔记
|
8月前
|
XML vr&ar Android开发
【Android App】实战项目之虚拟现实(VR)的全景相册(附源码和演示视频 可用于学习和大作业)
【Android App】实战项目之虚拟现实(VR)的全景相册(附源码和演示视频 可用于学习和大作业)
359 2