vue2的$attrs和$listeners若用$listeners传递过来的方法子组件如何使用

在Vue2中，$attrs和$listeners是父组件传递给子组件的属性和事件监听器对象。

$attrs是一个包含了父组件中非props属性的对象。这意味着，如果父组件给子组件传递了一些props之外的属性，这些属性可以通过$attrs在子组件中访问到。在子组件中，可以使用$attrs来接收父组件传递的属性，并在子组件的模板中使用。

$listeners是一个包含了父组件中非原生事件监听器的对象。这意味着，如果父组件在子组件中使用了非原生事件监听器（如@customEvent），子组件可以通过$listeners来接收并使用这些事件监听器。

下面是一个示例，展示了如何在子组件中使用$attrs和$listeners：

<template>
  <div>
    <p>子组件接收到的属性：{{ $attrs }}</p>
    <button v-on="$listeners">点击我触发父组件的事件</button>
  </div>
</template>

<script>
export default {
  mounted() {
    console.log(this.$attrs) // 输出父组件传递的属性
    console.log(this.$listeners) // 输出父组件传递的事件监听器
  }
}
</script>

在上面的示例中，子组件接收到的属性可以通过$attrs访问，并在模板中使用。按钮元素使用v-on="$listeners"来将父组件传递的事件监听器绑定到自己上面，从而触发父组件的相应事件。

希望对你有帮助