美文网首页
vue中导入外链css或js

vue中导入外链css或js

作者: jing_bao | 来源:发表于2020-08-04 17:36 被阅读0次

    在vue中导入自定义的css文件或js文件

    css文件
    在main.js中导入公共的css
    import '../static/css/common.css' //引入公用css

    在页面中引入单独css
    <style scoped>
    @import '../../static/css/header.css';
    </style>

    Js文件

    自定义js 中写:
    function title(t){
    alert(t);
    }

    export {
    title //多个方法在此处json中export出去
    }

    页面中使用:
    <template>
    <div>
    <button class="btn" @click="clickme">click me</button>
    </div>
    </template>
    <script>
    import {title} from './js/common.js' //可以选择需要的方法引入
    export default {
    data(){
    return{
    }
    },
    methods:{
    clickme(){
    title('你点我了');
    }
    }
    }
    </script>

    或者

    •   首先在main.js中引入:
      

    import Comjs from './js/common.js' //引入公用js
    Vue.prototype.$comjs = Comjs; //添加到vue属性中

    自定义js 中写:
    const comjs = {

    }

    comjs.title = function (title) {
    alert(title)
    }

    export default comjs;

    页面中使用:
    <template>
    <div>
    <button class="btn" @click="clickme">click me</button>
    </div>
    </template>

    <script>
    export default {
    data(){
    return{
    }
    },
    methods:{
    clickme(){
    this.$comjs.title('你点我了');
    }
    }
    }
    </script>

    相关文章

      网友评论

          本文标题:vue中导入外链css或js

          本文链接:https://www.haomeiwen.com/subject/eybanftx.html