<template>
    <div>
        <h4>按钮</h4>
        <sh-button type="primary">主要按钮</sh-button>
        <sh-button type="default">默认按钮</sh-button>
        <sh-button type="ordinary">普通按钮</sh-button>
        <sh-button type="disable">禁用按钮</sh-button>
        <sh-button type="other" icon="el-icon-upload">图文按钮</sh-button>
        <sh-button type="danger">警告按钮</sh-button>
        <sh-button type="warning">警示按钮</sh-button>
        <sh-button type="round"></sh-button>
        <sh-button type="square"></sh-button>
        <h4>按钮组合</h4>
        <sh-group-button>
            <sh-button type="default">取消</sh-button>
            <sh-button type="primary">确定</sh-button>
        </sh-group-button>
        <sh-group-button>
            <sh-button type="default">重置</sh-button>
            <sh-button type="primary">提交</sh-button>
        </sh-group-button>
        <sh-group-button>
            <sh-button type="ordinary">取消</sh-button>
            <sh-button type="danger">删除</sh-button>
        </sh-group-button>
        <h4>切换按钮</h4>
        <sh-switch-button>
            <sh-button type="group-first">切换</sh-button>
            <sh-button type="group-other">切换</sh-button>
            <sh-button type="group-last">切换</sh-button>
        </sh-switch-button>
    </div>
</template>

<script>
    import ComponentButton from "@/lib/components/Button/sh-button";
    export default {
        name: "button",
        components: {ComponentButton},
        data(){
            return{
                danger: 'danger'
            }
        }
    }
</script>

<style scoped>

</style>
