vue的public 引入ueditor文件过大导致首次加载慢的问题

左手的ㄟ右手 2023-06-14 04:18 19阅读 0赞

新建load.js文件：

export function loadScript(src, callback) {
      var script = document.createElement('script'),
        head = document.getElementsByTagName('head')[0];
      script.type = 'text/javascript';
      script.charset = 'UTF-8';
      script.src = src;
      if (script.addEventListener) {
        script.addEventListener('load', function () {
          callback();
        }, false);
      } else if (script.attachEvent) {
        script.attachEvent('onreadystatechange', function () {
          var target = window.event.srcElement;
          if (target.readyState == 'loaded') {
            callback();
          }
        });
      }
      head.appendChild(script);
    }

组件里：

html:

js:myConfig等其他数据自己写，主要是mounted里的加载

export default {
        data(){
            return {
                loading:false, 
        },
        mounted() {
        try{
          console.log(UE)
          this.loaing = true
        } catch(e){
          // return
          let that = this
          that.loadFunc('jquery-2.2.3.min.js',()=>{
            setTimeout(()=>{
              that.loadFunc('ueditor.configMin.js',()=>{
                that.loadFunc('ueditor.allMin.js',()=>{
                  that.loadFunc('dialogs/xiumi-ue-dialog-v5.js',()=>{
                    console.log('dialogs/xiumi-ue-dialog-v5.js');
                    that.loaing = true
                  })
                })
              })
            },1000)
          })
        }
      },
    methods:{
        loadFunc(src,callback){
          loadScript(`${process.env.BASE_URL}static/UE/${src}`,function(){callback()});
        },
      },
    
    }