button.uvue

<script>
import { type ItemType } from '@/components/enum-data/enum-data.vue'
export default {
	data() {
		return {
      plain_boolean: false,
      disabled_boolean: false,
      size_enum: [{"value":0,"name":"default"},{"value":1,"name":"mini"}] as ItemType[],
      size_enum_current: 0,
      type_enum: [{"value":0,"name":"default"},{"value":1,"name":"primary"},{"value":2,"name":"warn"}] as ItemType[],
      type_enum_current: 0
		}
	},
	methods: {
    change_plain_boolean(checked : boolean) { this.plain_boolean = checked },
    change_disabled_boolean(checked : boolean) { this.disabled_boolean = checked },
    radio_change_size_enum(checked : number) { this.size_enum_current = checked },
    radio_change_type_enum(checked : number) { this.type_enum_current = checked }
	}
}
</script>

<template>
	<view class="uni-flex-row">
<button :disabled="disabled_boolean" :size="size_enum[size_enum_current].name" :type="type_enum[type_enum_current].name" :plain="plain_boolean">uni-app-x</button>
	</view>
<!-- #ifdef APP -->
<scroll-view style="flex:1">
<!-- #endif -->
<view class="content nvue">

    <boolean-data :defaultValue="false" title="按钮是否镂空，背景色透明" @change="change_plain_boolean"></boolean-data>

    <boolean-data :defaultValue="false" title="是否禁用" @change="change_disabled_boolean"></boolean-data>

    <enum-data :items="size_enum" title="按钮的大小" @change="radio_change_size_enum"></enum-data>

    <enum-data :items="type_enum" title="按钮的类型" @change="radio_change_type_enum"></enum-data>
</view>
<!-- #ifdef APP -->
</scroll-view>
<!-- #endif -->
</template>

<style>

</style>