@ozo/react-rock/src/components/ThemeAdapter/Demo/Button.js

React 移动端开发脚手架，基于CRA3，通用、开箱即用。

import React from 'react';
import { Button } from '@material-ui/core';
import styled from 'styled-components';

const DemoView = styled.div`
    button {
        margin: 5px;
    }
`;
const PieceView = styled.div`
    margin-left: -5px;
    width: 100%;
`;

export default function ButtonDemo() {
    return (
        <DemoView>
            <h4>大按钮</h4>
            <PieceView>
                <Button variant="contained" color="primary" size="large" fullWidth>
                    主色 Primary 全宽 fullWidth
                </Button>
                <Button variant="contained" color="primary" size="large">
                    主色 Primary
                </Button>
                <Button variant="contained" disabled size="large">
                    禁用 Disabled
                </Button>
                <Button variant="outlined" color="primary" size="large">
                    主色 Primary
                </Button>
                <Button variant="outlined" disabled size="large">
                    禁用 Disabled
                </Button>
                <Button variant="outlined" size="large">
                    边框 Outlined
                </Button>
                <Button variant="outlined" disabled size="large">
                    边框 Outlined
                </Button>
            </PieceView>
            <h4>小按钮</h4>
            <PieceView>
                <Button variant="contained" color="primary" size="small">
                    主色 Primary
                </Button>
                <Button variant="contained" disabled size="small">
                    禁用 Disabled
                </Button>
                <Button variant="outlined" size="small">
                    边框 Outlined
                </Button>
                <Button variant="outlined" color="primary" size="small">
                    主色 Primary
                </Button>
                <Button variant="outlined" disabled size="small">
                    禁用 Disabled
                </Button>
                <Button variant="outlined" disabled size="small">
                    边框 Outlined
                </Button>
            </PieceView>
        </DemoView>
    );
}