1. 原文链接:https://jingyan.baidu.com/article/f96699bbfe9c9d894f3c1b4b.html

    两种解决方案:

    1:官方解决方案:

    受到 HTML 本身的一些限制,变通的方案是使用特殊的 is 特性

    应当注意,如果使用来自以下来源之一的字符串模板,则没有这些限制:

    eg1:用<script type="text/x-template">

    <comp></comp>

    改为

    <script type="text/x-template" id="comp">

    <div>XXXXX</div>

    </script>

    (博主试过不符合本博主的情况)

    eg2:用JavaScript 内联模板字符串

    比如:ES6引入了一种新型的字符串字面量语法,反撇号(`)

    eg3:用XXX.vue 组件

    博主不是在线环境,不符合博主

    eg4:用is (博主试过还是不行啊)

    将<comp></comp>

    改为<div is='comp'></div>

    2:暂时的不好的但也可以解决的....方案:

    created: function() {

    setTimeout(function() {

    var body = document.getElementById('ID');

    console.log(body);

    })

    },

  2. 2

    原因解析:

    当使用 DOM 作为模板时 (例如,使用 el 选项来把 Vue 实例挂载到一个已有内容的元素上),你会受到 HTML 本身的一些限制,因为 Vue 只有在浏览器解析、规范化模板之后才能获取其内容。

vue 钩子函数中获取不到DOM节点的更多相关文章

  1. react入门-----(jsx语法,在react中获取真实的dom节点)

    1.jsx语法 var names = ['Alice', 'Emily', 'Kate']; <!-- HTML 语言直接写在 JavaScript 语言之中,不加任何引号,这就是 JSX 的 ...

  2. vue 钩子函数 使用async await

    示例: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <tit ...

  3. 45、导航钩子函数中使用next()和next('\指定路径')的区别:

    当在router.beforeEach((to, from, next) 钩子函数中使用: 1.使用next()时,直接跳转到下一页,没有再执行导航钩子函数 2.使用next('指定路径')跳转到指定 ...

  4. 服务器表单字符串转化Vue表单挂在到对应DOM节点

    今天在项目开发中,遇到从后端返回的vue文件(包含template,js,css)的文件,试过用v-html解析文件,渲染到页面,但是无法渲染,后来去查了一堆资料,自己写了一个全局方法来解析这类文件 ...

  5. react.js 获取真实的DOM节点

    为了获取真实的dom节点,文本输入框必须有一个 ref 属性,然后 this.refs.[refName] 就会返回这个真实的 DOM 节点. var MyComponent = React.crea ...

  6. vue 钩子函数的使用

    1.什么是自定义指令,有哪些钩子函数及自定义指令的使用场景 ①自定义指令是什么?以及自定义指令的使用场景 在Vue中,有很多内置指令,但是这些指令只能满足我们最基础的使用,当我们在实际项目中遇到了必须 ...

  7. Vue钩子函数生命周期实例详解

    vue生命周期简介 Vue实例有一个完整的生命周期,也就是从开始创建.初始化数据.编译模板.挂载Dom.渲染→更新→渲染.卸载等一系列过程,我们称这是Vue的生命周期.通俗说就是Vue实例从创建到销毁 ...

  8. js函数中的BOM和DOM

    BOM 浏览器对象模型  screen对象 console.log(screen.width);// 屏幕宽度 console.log(screen.height);// 屏幕高度 console.l ...

  9. Vue(4)- 获取原生的DOM的方式、DIY脚手架、vue-cli的使用

    一.获取原生的DOM的方式 在js中,我们可以通过id.class或者标签获取DOM元素,vue中也为我们提供了获取原生DOM的方法,就是给标签或者组件添加ref属性,通过this.$refs获取,如 ...

随机推荐

  1. ELF文件格式理解

    ELF(Executable and Linking Format)是一种对象文件的格式,用于定义不同类型的对象文件(Object files)中都放了什么东西.以及都以什么样的格式去放这些东西.它自 ...

  2. 单节点oracle、ASM 详细安装步骤

    目录 1.安装环境 2.系统要求 2.1 Linux安装Oracle系统要求 1.查看RAM和交换空间以及磁盘大小 2.检查所需软件包 3.配置host和主机名 2.2修改操作系统核心参数 1.创建相 ...

  3. Python 2中万恶的字符编码

    Python2中如果文件存在中文,必须要指定#-*- coding:utf8 -*-或#coding:utf8,否则会报错.那这是为什么呢? 一.原理解析 我们知道,在计算机发展初期,计算机只能识别字 ...

  4. Some notes of An Insider's Guide to TOEFL iBT

    尽早把托福这个坑填上方是正道,在正式上托福课之前阅读了这本Guide,颇受启发——只要是考试,总是有固定的方法的= = An Insider's Guide to TOEFL iBT It is NO ...

  5. Centos修改IP的两种方式

    nmtui命令调出修改窗口:nmtui    重启网卡:/etc/init.d/network restart 或者:service network restart 方式二: 进入网络配置文件目录 首 ...

  6. C++使用socket传输图片

    Client: #include <WinSock2.h> #include <Windows.h> #include <stdio.h> #pragma comm ...

  7. poj3666/CF714E/hdu5256/BZOJ1367(???) Making the Grade[线性DP+离散化]

    给个$n<=2000$长度数列,可以把每个数改为另一个数代价是两数之差的绝对值.求把它改为单调不增or不减序列最小代价. 话说这题其实是一个结论题..找到结论应该就很好做了呢. 手玩的时候就有感 ...

  8. CSS三角的写法(兼容IE6)

    目录 简介 优点 原理 1. 先创建一个div 2. 然后给div设定边框. 3. 给div的四个边框都设置不同的颜色 4. 把宽度和高度都变成0 5. 其余角为透明 6. 兼容IE6浏览器 造成这样 ...

  9. 一个简单的ETL脚本的内容

    一个简单的ETL脚本应该包含如下内容 1.注释 2.设置字符集 3.基础路径参数 脚本路径 票据路径 日志路径 当前SHELL的脚本别名:declare SHELL_NAME=“${basename ...

  10. Acwing-97-约数之和(整数分解, 递推分治)

    链接: https://www.acwing.com/problem/content/99/ 题意: 假设现在有两个自然数A和B,S是AB的所有约数之和. 请你求出S mod 9901的值是多少. 思 ...