最近在碰到有同學問我，vue父組件怎么使用外部對象，具體例子如下：

有組件a：

<div @click="onClick">component a</div>

// componet a...methods: { onClick(evt) {  // doSomething 這里只能拿到 mouseEvent  this.outsideClickHandler(evt); // 調用外部處理函數 }}...

有組件B，引用組件a，并傳入outsideClickHandler方法：

<v-componetA :outside-click-handler="onClick">componentB</v-componetA>

對以上這種封裝是組件庫中再常見不過的封裝了，實際使用中，有時候會需在component B傳入component A的outsideClickHandler方法中使用component B中的數據對象，而component的代碼又不能更改，這時候怎么辦呢？

其實解決方案也是非常簡單，但是有時候我們會"執迷不悟"。

廢話不說，上代碼!

// componet b...data() { a: {} // 數據},methods: { onClick(evt) {  // 關鍵在于返回一個函數哦  return (evt) => {   // 這里也可以直接閉包使用   console.log(this.a);  } }}...

總之,對于vue函數來說，當無法直接傳入參數的時候，可以考慮閉包實現，本文所說的也只是一個簡單例子，js的函數作為一等公民還有很多有趣的應用。

總結

以上就是這篇文章的全部內容了，希望本文的內容對大家的學習或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對錯新站長站的支持。