基于vue3.0和element-plus的组件库
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

64 lines
1.5 KiB

<template>
<el-button :class="type || state.style.name" :size="state.size.size" :type="type" :icon="icon" :disabled="disabled"
:plain="plain" :round="round" :circle="circle" :loading="loading" :text="text" :link="link">
<slot />
</el-button>
</template>
<script lang="ts" setup>
import { useStore } from "vuex";
import { reactive, onMounted, ref } from "vue";
const { state } = useStore();
const prop = defineProps({
type: {
type: String,
default: null
},
icon: {
type: String,
default: null
},
disabled: {
type: Boolean,
default: false,
},
plain: {
type: Boolean,
default: false,
},
round: {
type: Boolean,
default: false,
},
circle: {
type: Boolean,
default: false,
},
loading: {
type: Boolean,
default: false,
},
text: {
type: Boolean,
default: false,
},
link: {
type: Boolean,
default: false,
}
});
onMounted(() => { });
</script>
<style lang="scss" scoped>
//@import url(); 引入公共css类
.dark {
--el-button-bg-color: v-bind('state.style.itemBg');
--el-button-border-color: v-bind('state.style.itemBg');
--el-button-text-color: v-bind('state.style.color');
--el-button-hover-bg-color: v-bind('state.style.itemBg');
--el-button-hover-border-color: v-bind('state.style.itemBg');
--el-button-hover-text-color: v-bind('state.style.color');
}
</style>