vue3+ts+vite项目三种形式父子组件的两种设置方式与两种传值方式
发布时间
阅读量:
阅读量
直接进入主题,提出问题。这是近期项目中遇到的一个关于definedProps与context传值方式的疑问,本文仅作为记录,欢迎各位专家给予指导。
在Vue3中,setup函数提供了一种更为简化的写法,即所谓的语法糖。
首先介绍在常规的setup(){}写法中如何实现父子组件间的传值。最近在该项目中遇到了一个陷阱,由于未注意到使用的是setup(){}的写法,直接调用了definedProps和definedEmits,导致程序持续报错。最终经过细致检查才找到问题所在,在setup(){}中应当使用context来进行相关操作。
1.setup(){}子传父
组成部分
<template>
//在vue3中可以不存在跟标签
<el-button @click="handelClick(something)">子组件</el-button>
</template>
<script lang='ts'>
import { ElButton } from 'element-plus'
export default{
setup(props,context){
const handelClick = (something:any):void =>{
全部评论 (0)
还没有任何评论哟~
