Vue3+ts+element-plus

大家好，想问下这个报错是怎么回事，使用button组件ts提示报错，该怎么解决呢

这篇文章讲的很详细，请看：vue+element-ui中button点击后不恢复原样
除此之外, 这篇博客: 结合Vue3.0学习elementUi 源码中的 （一）、button组件的简单解析 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:

button部分是由 button组件和button-group组件共同组成，
该部分的文件结构如下：
在这里插入图片描述
index文件是用于注册各组件的，方式和上面了解的一样，内容文件是.vue文件，通过名称可以知道对应的组件内容，直接看内容

button组件

<template>
  <button
    class="el-button"
    @click="handleClick"
    :disabled="buttonDisabled || loading"
    :autofocus="autofocus"
    :type="nativeType"
    :class="[
      type ? 'el-button--' + type : '',
      buttonSize ? 'el-button--' + buttonSize : '',
      {
        'is-disabled': buttonDisabled,
        'is-loading': loading,
        'is-plain': plain,
        'is-round': round,
        'is-circle': circle
      }
    ]"
  >
    <i class="el-icon-loading" v-if="loading"></i>
    <i :class="icon" v-if="icon && !loading"></i>
    <span v-if="$slots.default"><slot></slot></span>
  </button>
</template>
<script>
  export default {
    name: 'ElButton',

    inject: { // 注入对象，表单对象时要用到
      elForm: {
        default: ''
      },
      elFormItem: {
        default: ''
      }
    },

    props: {
      type: { // 按钮类型
        type: String,
        default: 'default'
      },
      size: String, //按钮尺寸
      icon: { // 图标类名 
        type: String,
        default: ''
      },
      nativeType: { // 原生 type 属性
        type: String,
        default: 'button'
      },
      loading: Boolean, // 是否加载状态
      disabled: Boolean, //是否禁用状态
      plain: Boolean, // 是否朴素按钮
      autofocus: Boolean, // 是否聚焦
      round: Boolean, //是否圆角
      circle: Boolean // 是否圆形
    },

    computed: {
      _elFormItemSize() { // 获取form表单对象的属性
        return (this.elFormItem || {}).elFormItemSize;
      },
      buttonSize() { // 按钮的大小
        return this.size || this._elFormItemSize || (this.$ELEMENT || {}).size;
      },
      buttonDisabled() { // 按钮是否禁用
        return this.disabled || (this.elForm || {}).disabled;
      }
    },

    methods: {
      handleClick(evt) { // 向父级传值，方法名称click
        this.$emit('click', evt);
      }
    }
  };
</script>

首先是template部分，这里面是一个button标签，button标签包裹两个i标签和一个span标签，第一i标签是指定loading图标，第二个是自定义图标，span标签是用于存放插槽内容的，也就是button的文字描述，提交或重置之类的。
其次是button中用到的属性，都在上面代码有注释

button-group组件

<template>
  <div class="el-button-group">
    <slot></slot>
  </div>
</template>
<script>
  export default {
    name: 'ElButtonGroup'
  };
</script>

这个组件没有什么内容就是向该组件内部插入内容，可以有多个按钮