#私藏项目实操分享# 【练习案例React六】项目中开始引入ant模块

简介: #私藏项目实操分享# 【练习案例React六】项目中开始引入ant模块

前言

我是歌谣 我有个兄弟 巅峰的时候排名c站总榜19 叫前端小歌谣 曾经我花了三年的时间创作了他 现在我要用五年的时间超越他 今天又是接近兄弟的一天人生难免坎坷 大不了从头再来 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷

导语

目前当前的一个开源项目每天都有更新 现在要加入一个新的模块了 ant的 平时工作中用到也有ant design

解决思路

yarn add antd

注意在app.css的头部加上

@import '~antd/dist/antd.css'; 引入样式 不然是无法看到样式的

代码部分

<Upload
              // fileList={modifyData.imgVoucher}
                listType="picture-card"
                showUploadList={false}
                onChange={this.handleChange}
              >
                {imgVoucher ? <img src={imgVoucher}
 style={{ width: 100 }} /> : <a>上传凭证</a>}
              </Upload>

就引入了上传组件了

运行结果

image.png

相关文章
|
前端开发
【React工作记录一百零一】再次接触老朋友react+ant design table合并单元格(2)
#yyds干货盘点 再次接触老朋友react+ant design table合并单元格
175 0
|
Web App开发 前端开发 JavaScript
React——前端开发中模块与组件【四】
React——前端开发中模块与组件【四】
263 0
|
前端开发 JavaScript 安全
使用React、TypeScript和Ant Design构建现代化前端应用
使用React、TypeScript和Ant Design构建现代化前端应用
800 0
|
JavaScript 前端开发 开发工具
TypeScript 可以与其他流行的开发工具和框架结合使用,如 Angular 和 React 等。具体应用案例解析
TypeScript 可以与其他流行的开发工具和框架结合使用,如 Angular 和 React 等。具体应用案例解析
213 1
|
前端开发 JavaScript 容器
第二章 简单实现Hello React案例
第二章 简单实现Hello React案例
113 0
|
存储 前端开发
React & webpack &ant 学习
React & webpack &ant 学习
142 0
|
前端开发
从零开始学习React-引入Ant Design 组件(八)
从零开始学习React-引入Ant Design 组件(八)
319 0
|
前端开发 数据格式
再次接触老朋友react+ant design table合并单元格
再次接触老朋友react+ant design table合并单元格
390 0
|
前端开发 数据格式
【React工作记录一百零一】再次接触老朋友react+ant design table合并单元格(1)
#yyds干货盘点 再次接触老朋友react+ant design table合并单元格
288 0
|
前端开发 JavaScript API
【React工作记录九十九】ant design mobile实现tab滚动效果和闪屏小记
【React工作记录九十九】ant design mobile实现tab滚动效果和闪屏小记
449 0