vue3
语法中setup
函数的props
和context
参数怎么运用,下面编程教程网小编给大家简单介绍一下具体实现代码!
父组件
<template>
<div>
父组件
</div>
<no-cont :mytitle="msg"
othertitle="其它的标题"
@sonclick="sonclick">
</no-cont>
</template>
<script>
import NoCont from "../components/NoCont.vue"
export default {
setup () {
let msg={
title:"父组件给子给子组件的数据"
}
function sonclick(msss:string){
console.log(msss)
}
return {msg,sonclick}
},
components:{
NoCont
}
}
</script>
子组件
<template>
<div @click="sonHander">
我是子组件中的数据
</div>
</template>
<script>
import { defineComponent,setup } from "vue";
export default defineComponent({
name: "NoCont",
setup(props,context){
console.log("props==>",props.mytitle);//输出的值是 undefined
function sonHander(){
context.emit("sonclick","子组件传递给父组件")
}
return {sonHander}
}
});
</script>
以上是编程学习网小编为您介绍的“vue3语法中setup函数的props和context参数怎么用”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vue3语法中setup函数的props和context参数怎么用
基础教程推荐
猜你喜欢
- Vue 自定义组件可同时通过属性、插槽设置内容的实施方案 2023-10-08
- JavaScript实现简单获取当前网页网址的方法 2024-02-08
- CSS裁剪属性clip使用的实例教程 2023-12-22
- 浅谈网页基本性能优化规则小结 2024-03-08
- javascript showModalDialog传值与FireFox的window.open 父子窗口传值示例 2024-02-09
- CSS多种方式实现底部对齐的示例代码 2023-12-23
- 详解vue-router基本使用 2024-04-23
- js刷新页面方法大全 2024-02-08
- JS前端知识点offset,scroll,client,冒泡,事件对象的应用整理总结 2024-02-07
- vue 使用$refs获取表单内容及v-model双向数据绑定 2023-10-08