這里是一個商城項目,在商品列表頁面需要增加對每個商品進行編輯關鍵詞的快捷按鈕設置,具體實現為點擊按鈕后打開一個彈窗,在彈窗中輸入信息提交到后臺,下面看一下實現流程。
首先在html中增加按鈕,先找到循環商品的 列表增加dom

對應頁面中的顯示為

然后需要初始化幾個變量

第一個為控制對話框的顯示隱藏,第二個存儲當前點擊的商品,然后dom中添加el-dialog

下面增加click方法,傳遞click事件和所點擊的商品信息

內容是將editKeyWordLabel設置為true 打開對話框,然后增加提交方法將數據提交到后臺

到此時所有的流程就完成了,看一下頁面流程

上一篇: 頁面自適應常用的幾種方式



