替换方法对比

JQuery

window.onload = function() { } 这个JS函数会在整个页面的document全部加载完成以后执行。
不仅要求页面的DOM tree全部加载完成,而且要求所有的外部图片和资源全部加载完成

 window.onload=function(){
    alert("页面资源内容已加载完");
};

$(function(){ } 这个JS函数在页面结构加载完成执行 ,无需等待页面资源全部加载完成等同于 $(document).ready(function(){}

 $(function()
{
    alert("页面结构加载完");
});
$(document).ready(function(){
	alert("页面结构加载完");
}

Vue

在这里插入图片描述

created:在模板渲染成 html 前调用,即通常初始化某些属性值,然后再渲染成视图。

  export default {
    name: 'Test',
    create:function () {
      alert("模板已渲染等待页面加载")
    }
  } 

mounted:在模板渲染 html 后显示 Dom 元素时调用,通常是初始化页面完成后,再对html的dom节点进行一些需要的操作。

  export default {
    name: 'Test',
    mounted:function () {
      alert("页面已加载")
    }
  } 

Vue 替代 JQuery

使用 mounted 替代 $(function(){});
$(function(){
    alert('页面已加载');
});

替换后

  export default {
    name: 'Test',
    mounted:function () {
      alert("页面已加载")
    }
  } 
Logo

前往低代码交流专区

更多推荐