比方說,我有以下標(biāo)記:<RouterLink tag="div" to="/somepath"> <p>Lorem ipsum dolor sit amet.</p> ... <button>A button</button></RouterLink>我正在使用tag="div",因?yàn)樵谠?lt;button>內(nèi)嵌套 a是無效的 HTML5。a使用此標(biāo)記,單擊 中的任意位置RouterLink(包括段落和按鈕)將導(dǎo)致導(dǎo)航。但我的要求是點(diǎn)擊按鈕不會(huì)導(dǎo)致導(dǎo)航,但點(diǎn)擊其他元素會(huì)。因此,我使用divwith@click處理程序來檢查單擊的元素是按鈕還是它的后代元素,如果不是,則只進(jìn)行導(dǎo)航:<div @click="navigateSomewhere"> ...</div>export default { methods: { navigateSomewhere($event) { if(!$event.closest("button")) this.$router.push("/somePath") } }}但我想知道是否有更清潔的方法來做到這一點(diǎn)。我還創(chuàng)建了一個(gè) MCVE:https ://codesandbox.io/s/vue-routerlink-button-3dlyx 。
如何在 RouterLink 中包含一個(gè)按鈕,以便在單擊按鈕時(shí)不會(huì)發(fā)生導(dǎo)航
至尊寶的傳說
2023-05-19 14:52:12