funnyui/src/ui/gradualIcon/index.js

This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).

import React from 'react';
import { PropTypes } from 'prop-types';
import './index.scss';
class GradualIcon extends React.Component {
    render() {
        const { className, icon, size, fontSize, dir, colors , children} = this.props;
        return <>
            <div className={`gadualIcon ${className}`} style={{
                width: size,
                background: `linear-gradient(${dir},${colors.join(',')})`
            }}>
                <i className={`iconfont ${icon}`} style={
                    { fontSize }
                }></i>
                {children}
            </div>
        </>
    }
}
GradualIcon.defaultProps = {
    icon: 'icon-renwu',
    size: '.5rem',//此默认值不要修改
    fontSize: '.50rem',
    dir: 'to bottom',
    colors: ['#fff', '#000']
}
GradualIcon.propTypes = {
    icon: PropTypes.string,
    size: PropTypes.string,
    fontSize: PropTypes.string,
    dir: PropTypes.string,
    colors: PropTypes.array,
}
export default GradualIcon