mounted

  • 类型:Function

  • 详细:

    实例被挂载后调用,这时 el 被新创建的 vm.$el 替换了。如果根实例挂载到了一个文档内的元素上,当 mounted 被调用时 vm.$el 也在文档内。

    注意 mounted 不会保证所有的子组件也都被挂载完成。如果你希望等到整个视图都渲染完毕再执行某些操作,可以在 mounted 内部使用 vm.$nextTick

    mounted: function () {
    this.$nextTick(function () {
    // 仅在整个视图都被渲染之后才会运行的代码
    })
    }

    该钩子在服务器端渲染期间不被调用。

<template>
<div class="app-container">
<div style="background-color: antiquewhite; height: 100px; width: 200px">
<span id="spTest">sdfsdf</span>
<div id="slider"></div>
</div>
</div>
</template>
<style>
@import "/Content/JS/Jquery/jqueryui.min.css";
@import "/Content/JS/Jquery/jquery-ui-slider-pips.min.css";
</style>
<script>
export default {
name: "imgview/viewimg2",
created() {
that.$nextTick(function () {
debugger;
});
},
mounted() {
this.$nextTick(function () {
console.log("log:");
console.log($("#spTest").html());
$("#slider").slider();
});
},
}; // $("#myslider").slider().slider("pips").slider("float");
</script>

  

VUE CLI中使用Jquery无法获取到dom节点的更多相关文章

  1. 在vue项目中引入jquery

    在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...

  2. Vue组件中引入jQuery

    一.安装jQuery依赖 在使用jQuery之前,我们首先要通过以下命令来安装jQuery依赖: npm install jquery --save # 如果你更换了淘宝镜像,可以使用cnpm来安装, ...

  3. Vue router中携带参数与获取参数

    Vue router中携带参数与获取参数 携带参数 query方式,就是?+&结构,例如/login?id=1 <router-link :to="{ name:'login' ...

  4. Jquery 方式获取 iframe Dom元素

    Jquery 方式获取 iframe Dom元素 測试页面代码: <html>  <head>   <title>jquery方式,訪问iframe页面dom元素& ...

  5. 在js文件中通过jquery定位到某个dom时候设置事件时候 相当于直接在dom里面添加事件

    在js文件中通过jquery定位到某个dom时候设置事件时候 相当于直接在dom里面添加事件  当触发事件时候 会把当前的dom传给该方法

  6. [译]怎样在Vue.js中使用jquery插件

    原文:http://gambardella.info/2016/09/05/guide-how-to-use-vue-js-with-jquery-plugins 使用Vue真的太棒了,但是也有可能使 ...

  7. vue cli中的env详解

    前言 相信使用过 vueCli 开发项目的小伙伴有点郁闷,正常开发时会有三个接口环境(开发,测试,正式),但是 vueCli 只提供了两种 development,production(不包含 tes ...

  8. 如何在Vue项目中引入jQuery?

    假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...

  9. Vue Cli 中使用 Karma / Chrome 执行样式相关单元测试

    在 GearCase 开源项目 中,我使用了 Vue Cli 的默认测试框架.因此和样式相关的东西,都无法进行测试.因为它并不类似于无头浏览器,而是存在于虚拟内存之中. 现状 在如下 button.s ...

  10. vue cli 中关于vue.config.js中chainWebpack的配置

    Vue CLI  的官方文档上写:调整webpack配置最简单的方式就是在vue.config.js中的configureWebpack选项提供一个对象. Vue CLI 内部的 webpack 配置 ...

随机推荐

  1. 凭证管理揭秘:Cookie-Session 与 JWT 方案的对决

    概述 在上一篇文章我们聊完了授权的过程,在服务器对客户端完成授权之后,服务器会给客户端颁发对应的凭证,客户端持有该凭证访问服务端,服务器便能知道你是谁,你有什么权限等信息.这一章我们具体聊聊常见的凭证 ...

  2. [Nova] belongsTo, belongsToMany 当前页动态 dependsOn 其它 fields, nova-belongs-to-dependency, belongs-to-many-field-nova

    nova-belongs-to-dependency 例子: use Manmohanjit\BelongsToDependency\BelongsToDependency; ... return [ ...

  3. C# 获取指定文件夹中所有的文件(包括子文件夹的文件)

    有个需求中需要播放指定路径的声音,但你必须要有该路径的声音才可以播放,如果没有该文件则播放默认的声音,该方法用于初始化应用的时候获取指定目录的所有文件,便于后来播放声音的时判断路径是否存在. usin ...

  4. K8s包管理工具Helm v3(19)

    一.Helm概述 官网:https://v3.helm.sh/zh/docs/ https://helm.sh/ helm 官方的 chart 站点: https://hub.kubeapps.com ...

  5. SonarQube+Maven+SonarQube Scanner

    1.SonarQube简介 官方网站地址:https://www.sonarqube.org/ SonrQube是一个开源的代码质量管理系统,用于检测代码中的错误,漏洞和代码规范.它可以以现有的Git ...

  6. C++编程英语词汇

    abstract抽象的 abstraction抽象性.抽象件 access访问 access level访问级别 access function访问函数 adapter适配器 address地址 ad ...

  7. SQL Server实战三:数据库表完整性约束及索引、视图的创建、编辑与删除

      本文介绍基于Microsoft SQL Server软件,实现数据库表完整性约束.索引与视图的创建.编辑与删除等操作的方法. 目录 1 交互式为数据库表S创建PRIMARY KEY约束 2 交互式 ...

  8. Django Admin后台管理:高效开发与实践

    title: Django Admin后台管理:高效开发与实践 date: 2024/5/8 14:24:15 updated: 2024/5/8 14:24:15 categories: 后端开发 ...

  9. grid布局方案

    前言 CSS网格布局用于将页面分割成数个主要区域,或者用来定义组件内部元素间大小.位置和图层之间的关系.像表格一样,网格布局让我们能够按行或列来对齐元素. 但是,使用CSS网格可能还是比CSS表格更容 ...

  10. 使用js有效括号匹配封装函数

    点击查看代码 function isValidParentheses(str) { // 定义一个栈,用于存储待匹配的左括号 let stack = []; // 定义一个对象,用于快速判断括号是否成 ...