<template>
    <div class="ht-base-message-focus-demo">
        <ht-base-button type="primary" @click="info">显示普通焦点提示</ht-base-button>
        <ht-base-button type="success" @click="success">显示成功焦点提示</ht-base-button>
        <ht-base-button type="warning" @click="warning">显示警告焦点提示</ht-base-button>
        <ht-base-button type="error" @click="error">显示错误焦点提示</ht-base-button>
    </div>
</template>

<script>
    export default {
        name: 'HtBaseMessageFocusDemo',
        methods: {
            info() {
                this.$HtBaseMessage.info({
                    content: '这是一条普通的提示',
                    types: 'focus',
                    closable: true
                });
            },
            success() {
                this.$HtBaseMessage.success({
                    content: '这是一条成功的提示',
                    types: 'focus',
                    closable: true
                });
            },
            warning() {
                this.$HtBaseMessage.warning({
                    content: '这是一条警告的提示',
                    types: 'focus',
                    closable: true
                });
            },
            error() {
                this.$HtBaseMessage.error({
                    content: '这是一条失败的提示',
                    types: 'focus',
                    closable: true
                });
            }
        }
    }
</script>
<style>
    .ht-base-message-focus-demo {

    }
</style>

