Vue基础——将原生事件绑定到组件

1、首先看一个小例子

父组件：

<template>
  <div id="app">
    <my-button @click="handleClick"></my-button>
  </div>
</template>

<script>
import MyButton from "@/components/myButton";
export default {
  name: 'App',
  components: {MyButton},
  methods: {
    handleClick() {
      console.log(111);
    }
  }
}
</script>

子组件

<template>
  <div>点我</div>
</template>

<script>
export default {
  name: "myButton",
  data() {
    return {}
  },
  computed: {},
  methods: {},
  mounted() {}
}
</script>

你觉得点击了按钮之后，会有输出吗？

鼠标按烂了都不会输出，不要按坏了你的鼠标