学前端的小王同学 2022-06-05 11:14 采纳率: 100%
浏览 614
已结题

原生js如何转成vue项目

想要把一个csshtmljs的网站整合成vue组件,初步了解template里面放html,style里面放css,script里面放js代码,但是由于这是vue文件所以,script应该是需要遵循vue.js语法在,不知道下面这串代码怎么遵循vue语法。
附上相关js代码
js


    const buttons = document.querySelectorAll(".card-buttons button");
        const sections = document.querySelectorAll(".card-section");
        const card = document.querySelector(".card");

        const handleButtonClick = e => {
          const targetSection = e.target.getAttribute("data-section");
          const section = document.querySelector(targetSection);
          targetSection !== "#about" ?
          card.classList.add("is-active") :
          card.classList.remove("is-active");
          card.setAttribute("data-state", targetSection);
          sections.forEach(s => s.classList.remove("is-active"));
          buttons.forEach(b => b.classList.remove("is-active"));
          e.target.classList.add("is-active");
          section.classList.add("is-active");
        };

        buttons.forEach(btn => {
          btn.addEventListener("click", handleButtonClick);
        });
    }
  }
  • 写回答

2条回答 默认 最新

  • Heerey525 前端领域新星创作者 2022-06-05 16:28
    关注

    给.card-buttons button 元素绑定@click="handleButtonClick" 类名动态添加可以改成object https://cn.vuejs.org/v2/guide/class-and-style.html
    还是建议你多看下Vue文档,熟悉之后就知道怎么改了

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 6月14日
  • 已采纳回答 6月6日
  • 创建了问题 6月5日