to put it simply, I wrote a component myself and wanted to click the register button on the previous page (registration page), and then jump to the component I wrote myself. The components that need to pop up are like dialog boxes. Ignore the problem of passing values for the time being.
the effect is as follows:
the component code is as follows
<template id="success">
<div class="show-modal">
<div class="show-mask">
<!-- -->
<img :src="icon.Iconframe" style="max-width:100%;">
<!-- -->
<img :src="icon.Icontick" style="z-index:100;position:absolute;margin-left:-75%;margin-top:115%;width:13%;height:7%;">
<!-- -->
<p style="margin-top:-73%;margin-left:18%;font-size:25px;">
<!-- -->
<cube-button class="button" @click="Postto" id="successbutton"></cube-button>
</div>
</div>
</template>
<script>
import Icontick from "@/assets/icons/ic_tick.png"
import Iconframe from "@/assets/icons/img_frame.png"
export default {
data () {
return {
icon: {
Icontick,
Iconframe
}
}
},
methods: {
Postto () {
window.location.href = "http://www.baidu.com"
}
},
props: {
value: {} // valuev-model
},
mounted () {
this.showMask = this.value
},
watch: {
value (newVal, oldVal) {
this.showMask = newVal
},
showMask (val) {
this.$emit("input", val)
},
closeMask () {
this.showMask = false
}
}
}
</script>