父组件
1、引入子组件
import MarkDialog from "@/views/home/digitalMap/markDialog.vue";
2、注册子组件
components: {
MarkDialog
},
3、使用子组件
<mark-dialog ref="markDialog"></mark-dialog>
4、通过jquery访问子组件的dom元素
const childDomElement = $(that.$refs["markDialog"].$el); childDomElement.find('.map-mark').css('background', 'red');
注意:$el :是 用于获取组件内 DOM(包括子组件,当前.vue组件,以及父组件)
在jQuery中,你可以使用.find()
方法或者子元素选择器">"
来访问子组件的DOM元素。
5、子组件
<template> <div class="container"> <span ref="mark-move" class="mark-move" /> </div> </template>