Javascript Vue js--通过方法访问道具失败
我正在将组件1中的proop传递给另一个组件2,该方法与组件2中的已传递/给定的props值相关。然后我尝试将该方法放入组件1中,并将该方法中的给定值更改为内部动态证明,它停止工作 访问方式的问题是肯定的: 微信=document.getElementsByClassName`this.iconClassName`[0].childNodes[2]; 请帮忙Javascript Vue js--通过方法访问道具失败,javascript,vue.js,vue-props,Javascript,Vue.js,Vue Props,我正在将组件1中的proop传递给另一个组件2,该方法与组件2中的已传递/给定的props值相关。然后我尝试将该方法放入组件1中,并将该方法中的给定值更改为内部动态证明,它停止工作 访问方式的问题是肯定的: 微信=document.getElementsByClassName`this.iconClassName`[0].childNodes[2]; 请帮忙 <template> <div :class="iconsClassName"> <div :c
<template>
<div :class="iconsClassName">
<div :class="iconClassName" v-for="(icon, index) in icons" :key="index">
<a :href="icon.mediaLink" target="_blank">
<svg style="width:16px;height:16px" viewBox="0 0 24 24">
<path fill="#ffffff" :d="icon.icon" />
</svg>
</a>
</div>
</div>
</template>
<script>
export default {
name: "mediaIcons",
props: {
iconsClassName: String,
iconClassName: String,
event: String
},
methods: {
wechat() {
let wechat = document.getElementsByClassName(this.iconsClassName)[0]
.childNodes[2];
wechat.addEventListener("click", alertWechat);
function alertWechat() {
alert("add me in weChat: eudora_neves");
wechat.childNodes[0].removeAttribute("href");
}
},
mounted: function() {
this.wechat();
}
};
</script>
如果我理解正确,您希望iconClassName可以单击吗 为此,您可以使用Vue的@click=alertWechat应该可以做到这一点。此外,这将缩短代码并使其更具可读性
<template>
<div :class="iconsClassName">
<div
:class="iconClassName"
v-for="(icon, index) in icons"
:key="index"
@click="alertWechat"
>
<!-- content -->
</div>
</div>
</template>
<script>
export default {
name: "mediaIcons",
props: {
iconsClassName: String,
iconClassName: String,
event: String
},
methods: {
function alertWechat() {
//content
}
}
};
</script>
@Phil需要帮助^^考虑使用ref属性,然后通过此引用$refs@IVO盖洛夫,非常感谢,但我试过了,运气不好。你能告诉我们你是怎么尝试的吗?我在您的代码中没有看到任何引用。在一些不相关的上下文中,vue等框架的目标是删除直接的dom修改,如getElement。在vue中使用事件绑定不是比获取元素更好的方法吗?