一个简单的React触感反馈的button组件

import React from 'react';
import './index.scss'; class Button extends React.Component {
static defaultProps = {
className: '',
children: null
} render() {
const {className, children, ...rest} = this.props; return <button className={`feedback-btn ${className}`} {...rest}>
{children}
</button>
}
} export default Button;
@charset 'utf-8';

.feedback-btn {
outline: none;
border: none;
background-color: transparent;
font-weight: inherit;
text-align: inherit; &:active {
opacity: 0.6;
}
}

极简触感反馈Button组件的更多相关文章

  1. 纯粹极简的react状态管理组件unstated

    简介 unstated是一个极简的状态管理组件 看它的简介:State so simple, it goes without saying 对比 对比redux: 更加灵活(相对的缺点是缺少规则,需要 ...

  2. WebFetch 是无依赖极简网页爬取组件

    WebFetch 是无依赖极简网页爬取组件,能在移动设备上运行的微型爬虫. WebFetch 要达到的目标: 没有第三方依赖jar包 减少内存使用 提高CPU利用率 加快网络爬取速度 简洁明了的api ...

  3. 极简Vue的异步组件函数

    export default new Router({ routes: [ { path: '/live', name: 'live', component: () => import('@/v ...

  4. HTML5 极简的JS函数

    页面初始化 mui框架将很多功能配置都集中在mui.init方法中,要使用某项功能,只需要在mui.init方法中完成对应参数配置即可,目前支持在mui.init方法中配置的功能包括:创建子页面.关闭 ...

  5. Vue.js 入门:从零开始做一个极简 To-Do 应用

    Vue.js 入门:从零开始做一个极简 To-Do 应用 写作时间:2019-12-10版本信息:Vue.js 2.6.10官网文档:https://cn.vuejs.org/ 前言  学习 Vue ...

  6. 你一定看得懂的 DDD+CQRS+EDA+ES 核心思想与极简可运行代码示例

    前言 随着分布式架构微服务的兴起,DDD(领域驱动设计).CQRS(命令查询职责分离).EDA(事件驱动架构).ES(事件溯源)等概念也一并成为时下的火热概念,我也在早些时候阅读了一些大佬的分析文,学 ...

  7. 极简实用的Asp.NetCore框架再新增商城模块

    概述 关于这个框架的背景,在前面我已经交代过了.不清楚的可以查看这个链接 1.极简实用的Asp.NetCore模块化框架决定免费开源了 2.极简实用的Asp.NetCore模块化框架新增CMS模块 算 ...

  8. Snabbt.js – 极简的 JavaScript 动画库

    Snabbt.js 是一个简约的 JavaScript 动画库.它会平移,旋转,缩放,倾斜和调整你的元素.通过矩阵乘法运算,变换等可以任何你想要的方式进行组合.最终的结果通过 CSS3 变换矩阵设置. ...

  9. 极极极极极简的的增删查改(CRUD)解决方案

    去年这个时候写过一篇全自动数据表格的文章http://www.cnblogs.com/liuyh/p/5747331.html.文章对自己写的一个js组件做了个概述,很多人把它当作了一款功能相似的纯前 ...

随机推荐

  1. SSH 相关基础

    检查是否安装: sudo apt-cache policy openssh-client sudo apt-cache policy  openssh-server 也可直接用 sudo apt-ca ...

  2. setStorage、getStorage、 removeStorage 封装

    // 本地存储 setStorage(name, data){ let dataType = typeof data; // json对象 if(dataType === 'object'){ win ...

  3. mysql各个引擎区别

    1.如果你有一个 MyISAM 数据表包含着 FULLTEXT 或 SPATIAL 索引,你将不能把它转换为使用 另一种引擎,因为只有 MyISAM 支持这两种索引. 2. 如果你有一个数据表包含着一 ...

  4. settings.gradle与build.gradle有什么区别

    参考回答 settings.gradle文件是gradle项目的总体配置文件,一般会把子项目中通用的一些配置放在这个文件中,有点雷士与maven的parent pom 文件. build.gradle ...

  5. 递归系列——树型JSON数据转换问题

    JSON数据转换方式: 1.标准结构=>简单结构 var root = { id: 'root', children: [ { id: "1", children: [ { ...

  6. CSS基础学习中的几大要点心得

    CSS是前端学习中较为简单但又非常复杂的课程,说简单是因为学习它并不需要太多推理论证和逻辑思维,说它非常复杂则是更多的侧重在它的“杂”上,因为太多的格式和套路需要我们注意.以下谨列出本人在CSS学习中 ...

  7. C++程序设计教材目录思维导图(增C++Primer)

    正在做C++思维导图,大工程,比较艰苦. 先做了三个C++教材目录的思维导图.C++教材不等于C++,这个容易些.看思维导图,整理所学知识,这个可以会. 给出三张图,对应三种教材: 谭浩强. C++程 ...

  8. SQLserver与Mysql的区别

    参考链接:https://www.cnblogs.com/qingqing-919/p/8417773.html

  9. jQuery打飞机游戏

    在线演示 本地下载

  10. spring自动扫描的注解@Component @Controller @Service @Repository

    @Component @Controller @Service @Repository的作用 1.@controller 控制器(注入服务)2.@service 服务(注入dao)3.@reposit ...