在Vue3中,在<script setup>中定义属性可用:
<template> <van-sticky> <van-nav-bar :title="props.title" ></van-nav-bar> </van-sticky> </template> <script setup> import { defineProps, reactive, ref, defineEmits } from "vue"; const props = defineProps(["title"]); </script> <style> </style>
子组件调用父组件的方法可用:
<template> <van-nav-bar title="XXX" left-text="返回" left-arrow @click-left="onClickLeft" ></van-nav-bar> </template> <script setup> import { defineComponent, reactive, ref, defineEmits } from "vue"; const emit = defineEmits(["onClickLeft"]); const onClickLeft = () => { emit("onClickLeft"); }; </script> <style> </style>
在父组件中可重写onClickLeft方法实现方法的多态性。