قراردادن تگ‌های html در فایل‌های vue.js

درود بر استاد عزیز

در فایل‌های قبلی طبق روال Html به این شکل این تگ‌ها رو قرار می‌دادیم

<div class="asfine-top">

<svg viewBox="0 0 100 100">

  <path d="M1.59830867,45.6389892 C3.72938689,47.7617329 7.10359408,47.7617329 9.2346723,45.6389892 L36.5835095,18.2202166 L36.5835095,92.6931408 C36.5835095,95.700361 38.8921776,98 41.9112051,98 C44.9302326,98 47.2389006,95.700361 47.2389006,92.6931408 L47.2389006,18.0433213 L74.9429175,45.6389892 C77.0739958,47.7617329 80.2706131,47.7617329 82.4016913,45.6389892 C84.5327696,43.5162455 84.5327696,40.1552347 82.4016913,38.032491 L45.8181818,1.59205776 C44.7526427,0.530685921 43.3319239,0 42.0887949,0 C40.6680761,0 39.2473573,0.530685921 38.1818182,1.59205776 L1.59830867,38.2093863 C-0.532769556,40.33213 -0.532769556,43.5162455 1.59830867,45.6389892 Z"></path>

</svg>

</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script type='text/javascript'>

var btn=$(".asfine-top");$(window).scroll(function(){$(window).scrollTop()>300?btn.addClass("show"):btn.removeClass("show")}),btn.on("click",function(o){o.preventDefault(),$("html, body").animate({scrollTop:0},"300")});

</script>

.asfine-top {

    position: fixed;

    opacity: 0;

    visibility: hidden;

    overflow: hidden;

    text-align: center;

    z-index: 99;

    width: 13px;

    height: 23px;

    left: 5px;

    bottom: -25px;

    fill: #2A2A3E;

    transition: 0.5s;

}

.asfine-top.show {

    visibility: visible;

    cursor: pointer;

    opacity: 1;

    bottom: 45px;

}

متاسفانه الان عمل نمیکنه

اگر ممکنه بگین چطورین اینا رو در فایل vue.js قرار بدم که دقیقن مثل فایل Html عمل کنه؟!

مرسی