父组件:
<BuildingAttrTable
v-if="type == 0"
:id="id"
ref="BuildingAttrTable"
:type="type"
:propdata="allData"
@myclickBui="onmyclickBui"
@myclickBui2="onmyclickBui2"
></BuildingAttrTable>
import { defineComponent, reactive, toRefs, ref, onMounted } from 'vue'
import BuildingAttrTable from '../../components/BuildingAttrTable.vue'
interface IState {
type: number
id: string
allData: object
}
setup() {
const state = reactive<IState>({
type: 0 ,
id: '',
allData: {},
})
const route = useRoute()
const { type, id } = route.query
const onmyclickBui = () => {
console.log("***************")
}
const onmyclickBui2 = val => {
console.log("***************")
}
// vue2 this.$refs.BuildingAttrTable vue3 BuildingAttrTable .value
const BuildingAttrTable = ref(null)
onMounted(() => {
})
onBeforeRouteUpdate(to => {
const { type, id } = to.query
})
return {
...toRefs(state),
BuildingAttrTable,
}
}
子组件:
import {
defineComponent,
reactive,
toRefs,
onMounted,
defineEmit,
useContext,
} from 'vue'
setup(props, context){
console.log(props.propdata)
console.log(props.propdata)
const emit = defineEmit(['myclickBui', 'myclickBui2'])
const ctx = useContext()
const emitclick = () => {
ctx.emit('myclickBui')
}
const emitclick2 = val => {
ctx.emit('myclickBui2', val)
}
}