Question

我在vue 2 js工作，我被困在js部分。我想将general.js文件用到我的posts.vue文件中，任何人都可以帮助我真的很感激：）

这是我的代码：

    <template>
        <div>
            <p> {{message}} </p>
        </div>
    </template>

    <script>
        import axios from 'axios';
        import _ from 'lodash';

        export default {
            data() {
                return {
                    message : 'Here is my HTML'    
                }
            }
        }
    </script>

Answer 1

如果你还没有这样做，你需要使用webpack提供的插件来首先包含jQuery本身。

new webpack.ProvidePlugin({
   $: "jquery",
  jQuery: "jquery"
})

更多信息：https://webpack.js.org/plugins/provide-plugin/

我一直试图避免在vue中使用jquery，但是我在组件中非常有限地使用jquery的一种方法如下。

假设我有一个非常基本的jquery插件alertText.js，定义如下。

//define the plugin
$.fn.alertText = function() {
   this.css( "color", "red" );
};

然后在我的component.vue文件中，我可以像在任何页面中一样包含jQuery插件。

<template>
  <div>
     <p class="alert-me">this text will be changed to red</p>
  </div>
</template>

<script type="text/javascript" src="alertText.js"></script>

<script>
    $('.alert-me').alertText(); // call the plugin on 'alert-me' class
</script>

<script>
    // define your component script
    export default {
         data():{
              //...
          }
     }
</script>

如何在vue 2组件中加载外部.js文件

1 个答案: