Vue 代码转换：将 HTML 代码改成适合 Vue 的代码
<p>"<template>\n <div class="Polaris-Stack Polaris-Stack--distributionEqualSpacing Polaris-Stack--alignmentCenter" style="margin-top: 1px;border-bottom: 1px #c1c1c1 solid;padding: 5px;">\n <div class="Polaris-Stack__Item">\n <div class="Polaris-Stack Polaris-Stack--spacingTight Polaris-Stack--alignmentCenter">\n <div class="Polaris-Stack__Item">\n <div class="sc-1ibht3l-0 uqRZq">\n </div>\n <div class="sc-1ibht3l-1 hIZedH">\n <div class="Polaris-ButtonGroup">\n <div class="Polaris-ButtonGroup__Item">\n <a data-polaris-unstyled="true" class="Polaris-Button" href="index.html">\n <span class="Polaris-Button__Content">\n <span class="Polaris-Button__Text">Dashboard</span>\n </span>\n </a>\n </div>\n <div class="Polaris-ButtonGroup__Item">\n <a data-polaris-unstyled="true" class="Polaris-Button" href="zone.html">\n <span class="Polaris-Button__Content">\n <span class="Polaris-Button__Text">Checkout Zones</span>\n </span>\n </a>\n </div>\n <div class="Polaris-ButtonGroup__Item">\n <a data-polaris-unstyled="true" class="Polaris-Button" href="funnel.html">\n <span class="Polaris-Button__Content">\n <span class="Polaris-Button__Text">Funnels</span>\n </span>\n </a>\n </div>\n <div class="Polaris-ButtonGroup__Item">\n <a data-polaris-unstyled="true" class="Polaris-Button" href="help.html">\n <span class="Polaris-Button__Content">\n <span class="Polaris-Button__Text">Help Center</span>\n </span>\n </a>\n </div>\n <div class="Polaris-ButtonGroup__Item">\n <div>\n <button type="button" id="moreSeting" class="Polaris-Button" tabindex="0" aria-controls="Popover486" aria-owns="Popover486" aria-haspopup="true" aria-expanded="false">\n <span class="Polaris-Button__Content">\n <span class="Polaris-Button__Text">More</span>\n <span class="Polaris-Button__Icon">\n <span class="Polaris-Icon">\n <svg viewBox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true">\n <path d="M5 8l5 5 5-5z" fill-rule="evenodd">\n </path>\n </svg>\n </span>\n </span>\n </span>\n <div id="dropdownContent" class="dropdown-content">\n <a href="payment.html">Payment</a>\n <a href="facebookPixel.html">Pixel</a>\n </div>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class="Polaris-Stack__Item">\n <div class="Polaris-Stack Polaris-Stack--spacingTight">\n <div class="Polaris-Stack__Item">\n <div class="sc-1pokqsy-0 dqXEel">\n <div tabindex="-1" aria-controls="Popover493" aria-owns="Popover493" aria-haspopup="true" aria-expanded="false">\n <div class="sc-1pokqsy-1 fQGSrj">\n <div class="Polaris-Stack Polaris-Stack--spacingExtraTight Polaris-Stack--alignmentCenter">\n <div class="Polaris-Stack__Item">\n <p>Status: </p>\n </div>\n <div class="Polaris-Stack__Item">\n <span class="Polaris-Badge Polaris-Badge--statusSuccess">\n <span class="Polaris-VisuallyHidden">Success</span>Enabled\n </span>\n </div>\n <div class="Polaris-Stack__Item">\n <span class="Polaris-Icon Polaris-Icon--colorInkLightest Polaris-Icon--isColored">\n <svg viewBox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true">\n <path d="M5 8l5 5 5-5z" fill-rule="evenodd">\n </path>\n </svg>\n </span>\n </div>\n </div>\n </div>\n </div>\n <div class="ynsxbt-0 iqzcmc" style="display: none;">\n <div class="ynsxbt-1 fHRVPN">\n <div class="Polaris-Card">\n <div class="Polaris-Card__Section">\n <div class="Polaris-Stack Polaris-Stack--distributionEqualSpacing">\n <div class="Polaris-Stack__Item">\n <h2 class="Polaris-Heading">Disable PPFunnels?</h2>\n </div>\n <div class="Polaris-Stack__Item">\n <div class="ynsxbt-2 gYaAIi">\n <span class="Polaris-Icon Polaris-Icon--colorInkLightest Polaris-Icon--isColored">\n <svg viewBox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true">\n <path d="M11.414 10l6.293-6.293a.999.999 0 1 0-1.414-1.414L10 8.586 3.707 2.293a.999.999 0 1 0-1.414 1.414L8.586 10l-6.293 6.293a.999.999 0 1 0 1.414 1.414L10 11.414l6.293 6.293a.997.997 0 0 0 1.414 0 .999.999 0 0 0 0-1.414L11.414 10z" fill-rule="evenodd">\n </path>\n </svg>\n </span>\n </div>\n </div>\n </div>\n </div>\n <div class="ynsxbt-3 bZoarq">\n <div class="Polaris-Card">\n <div class="Polaris-Card__Section">\n <div class="Polaris-TextContainer">\n <p>All PPFunnels features will be disabled.</p>\n <p>Checkouts will be processed by Shopify.</p>\n </div>\n </div>\n </div>\n </div>\n <div class="Polaris-Card__Section">\n <div class="Polaris-Stack Polaris-Stack--distributionTrailing">\n <div class="Polaris-Stack__Item">\n <div class="Polaris-ButtonGroup">\n <div class="Polaris-ButtonGroup__Item">\n <button type="button" class="Polaris-Button">\n <span class="Polaris-Button__Content">\n <span class="Polaris-Button__Text">Cancel</span>\n </span>\n </button>\n </div>\n <div class="Polaris-ButtonGroup__Item">\n <button type="button" class="Polaris-Button Polaris-Button--destructive">\n <span class="Polaris-Button__Content">\n <span class="Polaris-Button__Text">Disable PPFunnels</span>\n </span>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div> \n </div>\n </div>\n </div>\n </div>\n </div>\n</template>\n\n<script>\n export default {\n name: 'Home',\n };\n</script>\n\n<style>\n @import '../style.css'; \n</style>\n</p>
原文地址: https://www.cveoy.top/t/topic/p5mQ 著作权归作者所有。请勿转载和采集!