样式化组件的魅力(特点)
那么本节就是你想要知道的
React中组件形式
关于React中定义组件的形式,有如下几种方式,其中前两个在之前的学习当中,相信你已经很熟悉了的,如果不清楚,可以查看前面的内容的...类class声明的组件(类组件/容器组件)
函数式声明的组件(函数组件/无状态组件/UI组件)
样式化组件(styled-components)
本节主要讲的就是样式化组件,给一个React组件添加样式...下面一起来看看的
行内样式 VS 外部样式
想要给React组件添加样式,常见的方式有
在JSX上添加style属性定义行内样式
通过import关键字引入外部样式
像如下所示,在JSX上添加样式:...至于什么时候用attrs
使用attrs将属性传递给样式化组件
当你希望样式化组件的每个实例都具有该prop时使用attrs,换句话说,通过attrs设置的属性,它是公共的,如果每个实例需要不同的实例时则可直接传递...,使用这些不同样式时只需要给样式组件传递一个参数就可以了的,在样式化组件内部可以通过props来接收外部的的参数值
事件监听绑定:对于自定义的样式化组件可以进行事件监听的绑定,这正是解决类class声明的自定义组件