jquery引用到为vue

jquery的script如何引用到vue中,已经引入jquery,但不知道如何改写,放在哪里

      <script>
        Main = function () {
        }
        Main.tabletOpen = false
        Main.secretOnClick = function () {
          console.log('test')
          if (Main.tabletOpen) {
            Main.closeTablet()
          } else {
            Main.openTablet()
          }
          Main.tabletOpen = !Main.tabletOpen
        }
        Main.tunnelOnClick = function () {
          $('body').append('<div id="theLights"></div>')
          $('#theLights').fadeTo(900.0, 1.0, function () {
            window.location = 'darknet.html'
          })
        }
        Main.openTablet = function () {
          console.log($('#tableTop'))
          $('#secretButton').css('z-index', 0)
          $('#fullBody').css('position', 'absolute')
          $('#fullBody').animate({
            left: '1000px'
          }, 2000)
        }
        Main.closeTablet = function () {
          $('#fullBody').animate({
            left: '0px'
          }, 2000, function () {
            $('#secretButton').css('z-index', 999)
            $('#fullBody').css('position', 'relative')
          })
        }
      </script>

问一下你这个html的作用是干啥的,挂载Vue么,html中的js是干啥用的

.html中最外层div上的id,要和App.vue中id相同,而且他们同时挂载在main.js中

你如果希望将jquery写法改写成vue形式,可以将html部分也贴一下

方法一:vue中使用jQuery模块
方法二:vue中获取dom用ref,相应jQuery获取dom的地方可以用ref获取

mounted里面去写绑定事件

npm 装 jquery 并引入

如果不是脚手架 架子,用原始版本 cdn节点去引入vue 然后script引入组件 挂载引用vue,

1.在index引入

img


2.在


a(){
this.$nextTick(function () {
  // DOM 更新了  进行dom 操作
 $('#id')
})
}

如果不行 可以进行远程辅助