vue三大组件-事件-插槽

vue三大组件-事件

对于vue中的组件时间, 主要分为两类

普通事件	修饰符事件
通过@click, @input, @change, @xxx 等事件通过 this,$emit(“xxx”, …)触发	@input.trim, @click.stop, @sumit.prevent等, 一般用于原生html, 自定义组件需要自行开发支持(一般较少遇到)

对于一般的事件来说, 是写在模板内的, 但对于vue的单向数据流, 在模板内的方法是不允许更变位于调用页面的东西

所以如果更变模板内的事项,可以直接作用, 而对于更变调用页面数据, 我们采用的是将方法返回的方式来将修改方法返回到调用页面来进行相关操作, 具体实现为 this.emit(‘functionName’, param)

通过代码可以更加形象的描述这个过程

组件

<template>
    <div>
        name: {
  { name || "--" }}
        <br />
        <input :value="name" @change="handleChange" />
        <br />
        <br />
        <div @click="handleDivClick">
            <button @click="handleClick">重置成功</button>