I have a JavaScript code that I want to convert to Vue. Essentially, I am attempting to incorporate this code from https://codepen.io/kimdontdoit/pen/wvdKLJo
Here is how I am trying to integrate this code into mine:
<template>
<section id="successful-order" class="container">
<div class="row office-banner">
<div class="col-12">
<img :src="successful" alt="Popper Image"/>
<div class="sub-title">Your order is complete!</div>
<div>You will be receiving a confirmation email with your order details.</div>
<div class="button-area">
<button class="btn button">Checkout your tickets</button>
<button class="btn button-secondary">Go to homepage!</button>
</div>
</div>
</div>
</section>
</template>
<script>
import successful from "../../../../img/poppers.png";
export default {
data() {
return {
successful: successful,
color: ["#8b5642", "#6a696b"],
};
},
methods: {
frame() {
}
}
};
</script>
Ultimately, I also need to create a frame() function but I am relatively new to Vue and struggling to figure it out.