1、1 在Vue中，每个组件都有一个对应的虚拟DOM树，它是一个以组件根节点为起点的JavaScript对象2 当数据发生改变时，Vue会重新计算虚拟DOM树的结构，并和旧的虚拟DOM树进行比较3 在比较过程中，Vue使用Diff算法来找出。

2、效果图1ref 需要在dom渲染完成后才会有，在使用的时候确保dom已经渲染完成比如在生命周期 mounted 钩子中调用，或者在 this$nextTick= 中调用vue 问题笔记 ref获取不到指定的DOM节点问题解决1 this$refsxxx拿到虚拟dom，可。

3、虚拟节点有如下的属性 1sel 标签类型，例如 pdiv 2data 标签上的数据，例如 styleclassdata* 3children 子节点 4 text 文本内容 5elm虚拟节点绑定的真实 DOM。

4、在 vue3 中，我们一样可以通过为节点添加一个 ref 名称 ，但是接下来的步骤和 vue2 有些区别 1为节点添加一个 ref 名称 2创建 ref 响应式常量并且与 DOM 节点名称一致 ，且值为 null 3在 mounted 之后通过。

5、vue想要获取dom元素的高，一般情况下我们都可以想到写在mounted函数里，即dom加载完再获取，但是结果并不如我们所想，又想到用一个this$nextTick= 函数来获取，发现根本没用啊所以好的办法就是用一。

6、映射到真实的DOM实际上要经历VNode的 creatediff patch 等过程#160#160#160#160#160#160#160下面是vuejs从初始化到最终渲染的整个过程假如你想阅读Vue源码，这张图应该能够帮到你。

7、这次给大家带来怎样使用vue判断dom的class，使用vue判断dom的class注意事项有哪些，下面就是实战案例，一起来看一下vue点击给dom添加class然后获取含有class的dom itemname。

8、然后获取到该DOM元素之后改变相应的自定义属性的值，vue会报错 Avoid mutating a prop directly since the value will be overwritten whenever the parent component rerenders Instead， use a data or computed property。

9、一问题引入 原项目把一块内容直接写在了模块中浏览器显示的一整个页面，现在想把它提成一个单独组件，而且把其中使用 documentgetElementById#39id#39 改为 ref 获取元素的形式单独创建一个 vue 组件，通过绑。

10、vue中的ref是把当前dom元素 “ 抽离出来 ” ，只要通过 this$refs就可以获取到注意this指向，此方法尤其适用于父元素需要操作子组件的dom元素，这也是子传父传递数据的一种方法 下面让我来看个案例设置了一个button。

11、在vue中可以通过给标签加ref属性，就可以在js中利用ref去引用它，从而操作该dom元素以下是个例子Vue系列产品为3D自然环境的动画制作和渲染提供了一系列的解决方案Vue系列有很多不同的产品，这是为了满足不同阶层的用户。

12、我们已经执行完了 vm_render 方法拿到了 VNode ，现在将它作为参数传给 vm_update 方法并执行 vm_update 这个方法的作用就是就是将 VNode 转为真实的 Dom ，不过它有两个执行的时机我们现在先来看下。

13、eventtarget触发事件的元素对象不一定是绑定事件的对象，会因为事件冒泡变化eventcurrentTarget绑定事件的元素对象 参考vue中关于$event的通俗理解 Vue 点击获得父元素，子元素，兄弟元素DOM操作。

14、可以使用“$refs”获取带有ref属性的元素具体用法是，“$refsref属性名”也可以使用原生js获取带有id或class等属性的元素，还可以引入jq获取。

15、直接在标签中添加click事件@click＝fn，然后在vue实例中的methods配置项里添加方法fn，实现你的功能这样不行吗vue框架不是不能用原生js获取dom元素，只是用框架就是为了避免操作dom元素。