antd button
引用 :import { Button } from 'antd';
<Button
type = "primary" //按钮样式颜色
shape = "circle" //按钮圆角(默认为方形)
icon = "search" //加图标 ,string (search : 搜索 ,download : 下载 ),也可以直接插入Icon 标签
size = "large" //按钮大小,string 默认 middle
loading //加载状态 ,布尔值 ,默认false
block //将宽度设为父元素的宽度 ,布尔值 ,默认false
disabled //按钮失效,布尔值(默认false)
ghost //按钮背景透明,一般用在父元素有背景色,按钮为白色情况下 ,布尔值 (默认值false)
href = "baidu.com" //设置此属性将按钮转换为a标签 ,string
htmlType = "button" //按钮原生type属性 ,string
target = "_blank" //需要设置href属性,具有超链接target属性
onClick ={this.onclick} //点击事件,需要注意this指向
>
按钮讲解
</Button>
1. 可以直接插入Icon标签
<Button>按钮<Icon type="team"/></Button>
2. type 值包括 : primary(蓝色) ,dashed(虚线),danger(红色),不写type情况下为白色背景,黑字,边框
antd button的更多相关文章
- 十九、React UI框架Antd(Ant Design)的使用——及react Antd的使用 button组件 Icon组件 Layout组件 DatePicker日期组件
一.Antd(Ant Design)的使用:引入全部Css样式 1.1 antd官网: https://ant.design/docs/react/introduce-cn 1.2 React中使用A ...
- Python flask+react+antd实现登陆demo
这两天在研究flask和antd,想把这俩个东西结合来使用,单独学antd的时候用的是dva来配置,但是发现这样与flask结合的话需要启动两个服务,作为flask只是作为数据的接口,并没用用到其强大 ...
- react项目中使用antd
1.antd官网: https://ant.design/docs/react/introduce-cn 2.React中使用Antd 1.安装antd npm install antd --save ...
- antd引入普通html使用,将ant Design本地化
一直想着能本地化antd的,不用npm以及dva那么复杂的配置环境来开发,并且本地化以后对以后链接flask的模板渲染机制也能很好的结合.下面是具体的实现方法: 1.将react的相关链接引入: &l ...
- 前端笔记之React(三)使用动态样式表&antd&React脚手架&props实战
一.使用动态样式表 1.1 LESS使用 全局安装Less npm install -g less 创建1.less文件,然后可以用lessc命令来编译这个文件: lessc 1.less 1.css ...
- antd配置config-overrides.js文件
下载antd 包 npm install antd 下载依赖包(定义组件按需求打包) npm install react-app-rewired customize-cra babel-plugin- ...
- react_app 项目开发 (5)_前后端分离_后台管理系统_开始
项目描述 技术选型 react API 接口 接口文档,url,请求方式,参数类型, 根据文档描述的方法,进行 postman 测试,看是否能够得到理想的结果 collections - 创建文件取项 ...
- 将ant Design本地化,可通过link以及script直接引入html中使用
一直想着能本地化antd的,不用npm以及dva那么复杂的配置环境来开发,并且本地化以后对以后链接flask的模板渲染机制也能很好的结合.下面是具体的实现方法: 1.将react的相关链接引入: &l ...
- react使用ant-design组件库
新建项目并引入组件 1,全局安装脚手架 npm install -g create-react-app 2,新建项目 create-react-app reactantd 3,安装组件 npm ins ...
随机推荐
- Maven 常见知识点整理
认识 Maven Maven 的作用? 1.添加第三方jar包 2.解决jar包之间的依赖关系 3.获取第三方jar包 4.将项目拆成多个工程模块 Maven 是什么? 是Apache软件基金会组织维 ...
- Messenger和MVVM中的View Services
在前面的文章IoC容器和MVVM中, 介绍了IoC容器如何在大量用户类中帮助创建和分配用户类的实例.本文将介绍IoC容器如何帮助应用程序解耦,比如那些根据MVVM模式开发的应用.此模 式广泛应用在基于 ...
- css内容简介(层叠样式表)
css是对网页编辑的加色,是对其功能的渲染. 根据规范每个元素都有一个display属性,每个元素都有一个------------如div元素他的默认为block. 行内元素和块级元素 块级元素会占据 ...
- PHP学习5——异常处理
主要内容: PHP错误类型 异常的产生 错误日志 日志信息记录到操作系统日志 异常处理 扩展异常处理类 PHP错误类型 语法错误 执行时错误 逻辑错误 异常的产生 如果安装了xampp之后,在php. ...
- JavaScript的六种数据类型
JavaScript数据类型有六种:number.string.boolean.null.undefined.object
- JVM(四) G1 收集器工作原理介绍
此篇文章半原创是对参考资料中的知识点进行总结,欢迎评论指点,谢谢! 部分知识点总结来自R大的帖子,下文有参考资料的链接 概述 G1 收集是相比于其他收集器(可见 上一篇文章),可以独立运 ...
- WPF画箭头
简介 参考Using WPF to Visualize a Graph with Circular Dependencies的基础上写了一个WPF画箭头的库. 效果图如下: 使用的XAML代码如下: ...
- 一、python简单爬取静态网页
一.简单爬虫框架 简单爬虫框架由四个部分组成:URL管理器.网页下载器.网页解析器.调度器,还有应用这一部分,应用主要是NLP配合相关业务. 它的基本逻辑是这样的:给定一个要访问的URL,获取这个ht ...
- js分离html代码的body内外部分
//定义网页源码 str = '<!DOCTYPE html><html><head> <meta charset="UTF-8"> ...
- Java温故而知新(3)异常处理机制
异常处理是程序设计中一个非常重要的方面,也是程序设计的一大难点,从C开始,你也许已经知道如何用if...else...来控制异常了,也许是自发的,然而这种控制异常痛苦,同一个异常或者错误如果多个地方出 ...