如何在没有$ refs的情况下触发点击事件？

Question

我有这样的模板：

v0.1.0-go

嵌套跨度组件的模板如下：

<p @click="handleParagraphClick"><component v-for="item in items" :is="spanComponent"/></p>

段落组件在contenteditable div中呈现。

当我单击段落时，我想触发<span @click="handleSpanClick">{{content}}</span> 内跨度的click事件。

（当我单击段落时，我想将插入符号放入span中并将span标记为当前活动节点，可以通过调用handleParagraphClick来完成，但这是另一回事了。）

可以使用

完成

handleSpanClick

但是我还没有this.$refs.mySpan.click() 跨度。没有$refs怎么办？

更新。

（当我单击段落的空白处时，我想在最后一个跨度的结尾处插入插入符号，并触发该跨度的click事件。当我在跨度之间单击时，我想在右侧的开头插入插入符号跨度（或在左跨度的末尾）。

Answer 1

您有多个跨度作为动态分量。您打算在哪种方法中调用 handleSpanClick 方法？ 您仍然可以在v-for中使用$ refs来访问这样的组件数组：

<p @click="handleParagraphClick"><component v-for="item in items" :is="spanComponent" refs="spans"/></p>

代码：

const mySpan = this.$refs.spans[0] // get the first span for instance
mySpan.handleSpanClick()