一个简单的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. NFS客户端挂载目录后无写入权限的解决方案

    转载至:https://blog.csdn.net/younger_china/article/details/52089337 在客户机通过 mount -o rw -t nfs 192.168.1 ...

  2. 洛谷 P2955 [USACO09OCT]奇数偶数Even? Odd?【字符串/易错】

    题目描述 Bessie's cruel second grade teacher has assigned a list of N (1 <= N <= 100) positive int ...

  3. 为什么你应该使用OpenGL而不是DirectX?

    这是一篇很意思的博文,原文链接为:http://blog.wolfire.com/2010/01/Why-you-should-use-OpenGL-and-not-DirectX 大家可以思考一下: ...

  4. 基于jQuery,bootstrap的bootstrapValidator的学习(一)

    bootstrap:能够增加兼容性的强大框架. 因为移动端项目需要数据验证,就开始学习了bootstrapValidator . 1.需要引用的文件: css: bootstrap.min.css b ...

  5. 阿里巴巴资深技术专家无相:我们能从 InteliJ IDEA 中学到什么?

    本文来源于阿里巴巴资深技术专家无相在内网的分享,阿里巴巴中间件受权发布. 最近因为工作的关系,要将 Eclipse 的插件升级为 IDEA 插件.升级过程中,对 IDEA 插件做了些学习和研究,希望通 ...

  6. @codechef - KILLER@ Painting Tree

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 给定一个 N 个点的有根树,标号 1 到 N,以 1 为根.定义 ...

  7. 集合--Set&&HashSet和TreeSet

    特点:元素无序,不可重复 1.添加元素 set.add("tanlei"); set.addAll(Arrays.asList(44,"磊","磊&q ...

  8. nodeJs学习-08 cookie、session

    http-无状态的:两次访问之间,无区别,cookie可解决 cookie:在浏览器保存一些数据,每次请求都会带过来: 弊端:可以查看修改,并不安全.大小有限(4K) 读取--cookie-parse ...

  9. TIJ——Chapter Twelve:Error Handling with Exception

    Exception guidelines Use exceptions to: Handle problems at the appropriate level.(Avoid catching exc ...

  10. Libevent:2设置

    Libevent有一些整个进程共享的全局设置.这些设置会影响到整个的库.因此必须在调用Libevent其他函数之前进行设置,否则,LIbevent就会陷入不一致的状态. 一:Libevent中的日志信 ...