elementui 的 el-dialog 里面獲取不到dom元素問題,設置表單滾動條到頂部問題


el-dialog 里面是一個表單,表單元素比較多,所以頁面有滾動條。需要設置每次打開表單的時候,滾動條在頂部。

頁面有一個按鈕,點擊按鈕打開el-dialog 彈框。

一開始在網山搜索,有給元素設 id ,然后用 document.getElementById("idName").scrollTop = 0; 來設置滾動條到頂部。

也有說給元素設置 ref="box",然后在代碼中 使用 this.$refs.box.scrollTop = 0 ; 來設置滾動條 到頂部。

如下代碼:

methods(){ handleBtnclick(){ this..dialogFormVisible = true; //document.getElementById("myform").scrollTop = 0;
        this.$refs.box.scrollTop = 0; } }

上面兩種方法都是直接報錯,后來才知道是獲取不到元素。因為dialog在初始的時候沒有加載,自然調用不到,當dialog顯示時,需要用到nextTick,使dom更新之后再調用。就可以調用到了。

修改后代碼如下:

methods(){ handleBtnclick(){ this..dialogFormVisible = true; this.$nextTick(() => { // this.$refs.box.scrollTop = 0;
          document.getElementById("myform").scrollTop = 0; }); } }

用到 nextTick 之后,獲取id的方法,或者 ref 的方法都可以。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM