zoukankan      html  css  js  c++  java
  • vue 里面引入外部js的问题 和js文件加载顺序的问题(元素还没有被渲染到页面上,js获取不到该元素)

    两个问题 首先是怎样引入的问题:

    首先说明:js文件不能放在components文件夹下

    方法一: 在组件内直接引用

        `import swiper from './swiper.js'`
    

    方法二 : 全局注册引用

            function aa(){
                console.log("11");
            }
            export  {  one }
    
            import one from './common/js.js';
            Vue.prototype.ss=one;
    
            this.ss.aa();    //在需要的地方使用
    

    按照一定顺序加载js的方法:

    方法一: 相当于clickOne事件运行时加载js文件

    组件内代码:

    <script>
         import {one} from '../js/one.js'     //接收js内暴露的对象
         export default {
              data () {
                return {
                      testvalue: '11'
                }
              },
        methods:{
          clickOne:function(){
              one();    //运行
          }
      }
    }
    
    </script>
    

    one.js内代码:

    function ss() {
    console.log('1111111111');
    }
    export { one }       //很重要 要暴露出去
    

    方法二: 与方法一类似 就是在mounted钩子函数内调用

    <script>
    import {one} from '../js/one.js'     //接收js内暴露的对象
    export default {
      data () {
        return {
          testvalue: ''
        }
      },
      mounted(){
          clickOne:function(){
              one();    //运行
          }
      }
    }
    
    </script>
    

    one.js内代码:

    function ss() {
    console.log('1111111111');
    }
    export { one }       //很重要 要暴露出去
    
  • 相关阅读:
    PAT B1045 快速排序 (25 分)
    PAT B1042 字符统计 (20 分)
    PAT B1040 有几个PAT (25 分)
    PAT B1035 插入与归并 (25 分)
    PAT B1034 有理数四则运算 (20 分)
    PAT B1033 旧键盘打字 (20 分)
    HDU 1231 最大连续子序列
    HDU 1166 敌兵布阵
    HDU 1715 大菲波数
    HDU 1016 Prime Ring Problem
  • 原文地址:https://www.cnblogs.com/panghu123/p/11706542.html
Copyright © 2011-2022 走看看