MoreHook

Appearance

Return to top
On this page

button

按钮组件

Demo

source

按钮组件

我是Btn默认填充值，可以通过hook更改：asdasdasd
------------父子组件分界线------------
我是smallBtn默认填充值，可以通过hook更改：asdasdasd

Usage

html
<template>
  <div>
    <p>按钮组件</p>
    <button></button>
  </div>
</template>

<script lang="ts" setup>
import { button } from '@morehook/component'
</script>

Type Declarations

Show Type Declarations
typescript
export declare const Button: WithInstall<
  DefineComponent<
    {
      text: StringConstructor
      type: {
        type: PropType<ButtonType>
        default: ButtonType
      }
      loadingText: StringConstructor
      color: StringConstructor
      loading: BooleanConstructor
      disabled: BooleanConstructor
    },
    () => JSX.Element,
    unknown,
    {},
    {},
    ComponentOptionsMixin,
    ComponentOptionsMixin,
    ("click" | "clickSmall")[],
    "click" | "clickSmall",
    VNodeProps & AllowedComponentProps & ComponentCustomProps,
    Readonly<
      ExtractPropTypes<{
        text: StringConstructor
        type: {
          type: PropType<ButtonType>
          default: ButtonType
        }
        loadingText: StringConstructor
        color: StringConstructor
        loading: BooleanConstructor
        disabled: BooleanConstructor
      }>
    > & {
      onClick?: ((...args: any[]) => any) | undefined
      onClickSmall?: ((...args: any[]) => any) | undefined
    },
    {
      type: ButtonType
      loading: boolean
      disabled: boolean
    }
  >
>
export default Button
export { buttonProps, useBtn, useSmallBtn } from "./Button"
export type { ButtonProps } from "./Button"
export type { ButtonType, ButtonSize } from "./types"
declare module "vue-demi" {
  interface GlobalComponents {
    FastUseButton: typeof Button
  }
}

Source

Source • Demo • Docs