工具

HBuilderXGitnpm瀏覽器技術

Vue3Element PlusJavaScript在element plus組件中，彈窗el-dialog可以用來輸入數據，還可以展示數據。如果在一個彈窗中輸入不同的字段值，點擊保存(確定)關閉自身，然后打開另一個新窗口，并將輸入值傳輸到新窗口中。下面利用實例說明：

操作步驟：

1、在vue3+element plus框架項目中，新建vue文件ValueTransfer

創建vue3項目，并新建vue文件

2、打開vue文件，利用element plus組件布局，插入一個el-button、一個彈窗el-dialog，分別綁定不同的對象變量

插入按鈕和彈窗，綁定不同對象值

3、接著，添加一個查看信息的彈窗，并插入一個表單元素

添加查看信息彈窗，插入表單

4、在script標簽中，初始化彈窗變量和表單對象變量

初始化彈窗變量和表單對象變量

5、在methods對象中，定義確定按鈕事件，設置彈窗可顯；給彈窗輸入框進行賦值

定義事件，顯示彈窗，表單賦值

6、在項目鼠標右鍵，使用命令運行項目；打開瀏覽器，輸入地址訪問界面

運行項目，打開瀏覽器，查看界面

7、點擊新增按鈕，打開新增學生窗口，輸入學號、姓名和年齡，然后單擊確定

點擊新增，打開窗口，輸入字段值

8、關閉新增學生窗口，打開查看信息窗口，查看新增和查看窗口字段值

打開查看信息窗口，比對前后的值

本書從源碼層面分析了Vue.js。首先，簡要介紹了Vue.js；然后詳細講解了其內部核心技術“變化偵測”，這里帶領大家從0到1實現一個簡單的“變化偵測”系統；接著詳細介紹了虛擬DOM技術，其中包括虛擬DOM的原理及其patching算法；緊接著詳細討論了模板編譯技術，其中包括模板解析器的實現原理、優化器的原理以及代碼生成器的原理；最后詳細介紹了其整體架構以及提供給我們使用的各種API的內部原理，同時還介紹了生命周期、錯誤處理、指令系統與模板過濾器等功能的原理。

總結

以上是生活随笔為你收集整理的element标签弹窗_如何在element plus中实现不同弹窗传值的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。