vue elementUI tree樹形控件獲取父節(jié)點ID的實例
更新時間：2018年09月12日 10:18:30 作者：為什么名字都被占用
今天小編就為大家分享一篇vue elementUI tree樹形控件獲取父節(jié)點ID的實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
首先找到element-ui.common.js文件 如下 具體看你工程下的node_modules
D:\workSpace\vue_manage\node_modules\element-ui\lib\element-ui.common.js
找到getCheckedNodes該方法 細節(jié)如下我的該方法在21618行
TreeStore.prototype.getCheckedNodes = function getCheckedNodes() {
var leafOnly = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var checkedNodes = [];
var traverse = function traverse(node) {
var childNodes = node.root ? node.root.childNodes : node.childNodes;
childNodes.forEach(function (child) {
if (child.checked && (!leafOnly || leafOnly && child.isLeaf)) {
checkedNodes.push(child.data);
}
traverse(child);
});
};
traverse(this);
return checkedNodes;
};
修改 其中的if判斷
TreeStore.prototype.getCheckedNodes = function getCheckedNodes() {
var leafOnly = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var checkedNodes = [];
var traverse = function traverse(node) {
var childNodes = node.root ? node.root.childNodes : node.childNodes;
childNodes.forEach(function (child) {
if ((child.checked || child.indeterminate) && (!leafOnly || leafOnly && child.isLeaf)) {
checkedNodes.push(child.data);
}
traverse(child);
});
};
traverse(this);
return checkedNodes;
};
然后重啟項目
console.log(this.$refs.tree.getCheckedKeys());就可以拿到父節(jié)點的ID啦
以上這篇vue elementUI tree樹形控件獲取父節(jié)點ID的實例就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue綁定數(shù)字類型 value為數(shù)字的實例
這篇文章主要介紹了vue綁定數(shù)字類型 value為數(shù)字的實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
vue項目中,前端使用axios與后臺進行數(shù)據(jù)請求或者提交的時候,如果后臺沒有設(shè)置跨域,瀏覽器做數(shù)據(jù)請求的時候就會報錯,這篇文章主要給大家介紹了關(guān)于vue如何解決axios請求前端跨域問題的相關(guān)資料,需要的朋友可以參考下2021-10-10
vue2項目導(dǎo)出操作實現(xiàn)方法(后端接口導(dǎo)出、前端直接做導(dǎo)出)
這篇文章主要給大家介紹了關(guān)于vue2項目導(dǎo)出操作實現(xiàn)方法的相關(guān)資料,文中介紹的是后端接口導(dǎo)出、前端直接做導(dǎo)出,通過代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考借鑒價值,需要的朋友可以參考下2024-05-05
Vuex 的 store 接受 plugins 選項，這個選項暴露出每次 mutation 的鉤子。Vuex 插件就是一個函數(shù)，這篇文章主要介紹了vuex 中插件的編寫案例,本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友可以參考下2019-06-06
這篇文章主要是來和大家一起討論一下Vue2與Vue3中響應(yīng)式的原理，文中的相關(guān)示例代碼簡潔易懂，對我們深入了解Vue有一定的幫助，需要的可以參考下2023-07-07
使用vue-draggable-plus實現(xiàn)拖拽排序
最近遇到一個需求,在 Vue3 的一個 H5 頁面當(dāng)中點擊拖拽圖標(biāo)上下拖動 tab 子項,然后點擊保存可以保存最新的 tab 項順序,同事說可以用 vue-draggable-plus 這個庫來實現(xiàn)拖拽,所以本文給大家介紹了如何使用vue-draggable-plus實現(xiàn)拖拽排序,需要的朋友可以參考下2024-01-01
這篇文章主要介紹了Vue Element UI使用中遇到的問題，對ElementUI感興趣的同學(xué)，可以參考下2021-05-05
前端插件庫之vue3使用vue-codemirror插件的步驟和實例
CodeMirror是一款基于JavaScript、面向語言的前端代碼編輯器,下面這篇文章主要給大家介紹了關(guān)于前端插件庫之vue3使用vue-codemirror插件的步驟和實例,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-07-07
這篇文章主要給大家介紹了如何從零開始實現(xiàn)Vue簡單的Toast插件的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-12-12
vue-resource 攔截器interceptors使用詳解
這篇文章主要介紹了vue-resource 攔截器interceptors使用詳解，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01