關(guān)于Vue頁面JS+JQ無法調(diào)用頁面方法與data

Elle 發(fā)布于2019-08-26 12:01 / 1153人閱讀

摘要：一在使用開發(fā)的過程中難免要整合第三方或者。但是整合后的與無法使用頁面里面的方法與。時常發(fā)生明明在同一個頁面里面卻無法調(diào)用到方法屬性。這是因為函數(shù)創(chuàng)建了自己的，所以無法獲取到我們想要的。三觸發(fā)方法調(diào)用不能使用需要使用的方式，這個特有的寫法。

一、
在使用vue開發(fā)的過程中難免要整合第三方j(luò)s或者jq。
但是整合后的js與jq無法使用vue頁面里面的方法與data。
時常發(fā)生明明在同一個vue頁面里面卻無法調(diào)用到方法屬性。
其實這是你的調(diào)用方式不對。
我遇到過的就是jquery-contextmenu的右擊事件問題
這是我們要付給右擊事件的操作，selector是id，items是右擊事件觸發(fā)的方法在下面（這里的callback回調(diào)函數(shù)，方法.call（本身的this,參數(shù)S）的意思是：在這個方法里調(diào)用其他對象的方法，以其他對象替代本身對象）

二、
這是觸發(fā)事件的定義在data里面定義箭頭函數(shù)，然后傳給上圖的方法里

然后我們來看一下效果,當我點擊添加節(jié)點可以運行但是單擊添加子節(jié)點報錯了。這是因為函數(shù)創(chuàng)建了自己的this，所以無法獲取到我們想要的。而箭頭函數(shù)不會創(chuàng)建自己的this,它只會從自己的作用域鏈的上一層繼承this。所以能訪問到我們所定義的屬性值。

三、
觸發(fā)方法調(diào)用不能使用function(){}
需要使用()=>{}的方式，這個ES6特有的寫法。es6 箭頭函數(shù)不會有新的作用域
如果你是在第三方j(luò)s中要調(diào)用vue頁面的data、methods的話必須先以參數(shù)的形式轉(zhuǎn)過去，然后在根據(jù)參數(shù)調(diào)用。然后vue頁面就是如上所述的那種寫法。

箭頭函數(shù)文檔

云服務(wù)器 GPU云服務(wù)器 vue.js多頁面 js調(diào)用百度頁面 iframe調(diào)用父頁面js js+調(diào)用另一個頁面的數(shù)據(jù)

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/108033.html

相關(guān)文章

可視化拖拽 UI 布局之拖拽篇

前言：前段時間負責公司的運營管理后臺項目，通過運營后臺的PC端拖拽配置布局，達到App首頁模板的動態(tài)UI界面配置，生成頁面。趁著周末，整理一下當時所了解到的拖拽。文章會根據(jù)大家的反饋或者自己學習經(jīng)驗的累積成長不定期更新豐富。如果你想了解更多PC端的拖拽開發(fā)，歡迎點贊關(guān)注或者收藏一波[鞠躬]。之前在掘金一篇文章里看到這段話: UI 開發(fā)的三種模式 1.手寫標簽和樣式代碼，生成頁面 2.可視化拖拽 ...

ACb0y 2019-08-22 13:58 評論0 收藏0
Vue作為組件在前端項目中的應(yīng)用&Vue.set 的用法

摘要：業(yè)務(wù)背景是，在的前端項目中加入作為組件。但隨著需要登錄的頁面的增多，多個頁面都需要添加相同的，，以及前端登錄邏輯，所以在原先的項目中添加了，將重復(fù)的添加的代碼加入到了文件中，然后通過方法將對象掛載到某個的節(jié)點上。業(yè)務(wù)背景是，在jq的前端項目中加入Vue作為組件。原本的登錄功能是每個頁面加一個登錄彈窗（手機號+驗證碼驗證登錄），然后發(fā)ajax請求到后端，登錄成功后再進行一些操作。但...

hersion 2019-06-28 18:34 評論0 收藏0
vue-cli + webpack 多頁面實例配置優(yōu)化方法

摘要：在谷歌找多頁面，實例還是比較少，功夫不負有心人，在那找到了，具體可以到這個，非常感謝童鞋，今天要講的內(nèi)容是基于童鞋的多頁面實例上再優(yōu)化的。有需要一起交流的可以加我的微信，，記得備注技術(shù)交流哈。 vue+webpack是否有多頁面目前使用vue來做項目，估計大部分都是單頁面（SPA）應(yīng)用，一個輕型的 MVVM 框架，誰用了MVVM框架，就再也回不去JQ時代了，哈哈。在手機端的項目，使...

Taste 2019-08-20 10:36 評論0 收藏0
在沒有DOM操作的日子里，我是怎么熬過來的（上）

摘要：至于我為何要這么做，請聽閏土娓娓道來。那么接下來，正文從這開始熟悉閏土的朋友都知道，我是從時代過來的前端，在剛接觸和這類框架的時候，完全可以用一臉懵逼來形容我，最為貼切。作者閏土少年出處本博客的文章如無特殊說明，均為原創(chuàng)，轉(zhuǎn)載請注明出處。 showImg(https://segmentfault.com/img/bVZjKW?w=670&h=442); 前言在我動筆寫這篇文章的時候，...

shuibo 2019-08-21 17:49 評論0 收藏0
另辟蹊徑：vue單頁面，多路由，前進刷新，后退不刷新

摘要：如何添加這個條件，判斷用戶是否刷新了頁面呢我們知道，當使用后，只有第一次進入后會觸發(fā)鉤子函數(shù)，再次進入就不再執(zhí)行了。目的：vue-cli構(gòu)建的vue單頁面應(yīng)用，某些特定的頁面，實現(xiàn)前進刷新，后退不刷新，類似app般的用戶體驗。注：　此處的刷新特指當進入此頁面時，觸發(fā)ajax請求，向服務(wù)器獲取數(shù)據(jù)。不刷新特指當進入此頁面時，不觸發(fā)ajax請求，而是使用之前緩存的數(shù)據(jù)，以便減少服務(wù)器請求...

Ocean 2019-08-21 17:43 評論0 收藏0