Vue3页面引入Jquery后,在JS代码中可以使用Jquery方法,但是在html代码中使用会报错?

下面代码在html中使用jquery会报错,调用引入的其他js中的方法也一样报错,应该咋解决
Uncaught TypeError: jQuery is not a function
vue版本是3.2.45

<body>
  <div id="app" v-cloak>
  <input id="aud" type="text" value="123"/>
  <!-- 这里使用会报错 -->
   <!-- {{jQuery('#aud').val()}}-->
  </div>
  <script src="https://code.jquery.com/jquery-3.6.1.min.js"></script>
  <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
  <script>
  const {createApp} = Vue;
  const app = createApp({
      data() {
        return {}
      },
      methods: {},
      mounted() {
        //这里可以正常调用
        console.log(jQuery('#aud').val());
      }
  })
  app.mount('#app');
  </script>
</body>
阅读 3.2k
3 个回答
✓ 已被采纳新手上路,请多包涵

解决了

app.config.globalProperties.$UD = $UD;
app.config.globalProperties.jQuery= jQuery

这样就可以直接在vue组件和html里使用了

在vue的template中使用变量必须是当前组件实例下可访问的属性,如this.xxx;jQuery是window下的变量,template中使用jQuery会报错,可以写成:

// 方法一:全局写法
Vue.protype.Jquery = Jquery 

// 方法二:局部写法
{
  computed: {
    Jquery () {
      return Jquery
    }
  }
}

用vue了,为什么还要引Jquery!
vue3,貌似js和ts都可以。
请问js什么事情做不到?

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题