資訊專欄INFORMATION COLUMN
摘要：當新增和編輯模態框內容一樣時這時候就可以共用一個模態框減少代碼量具體代碼如下新增新增不需要傳遞任何參數編輯編輯時候需要傳遞當前行的模態框內容公司名稱請輸入內容統一信用社碼請輸入內容公司地址請輸入內
當新增和編輯模態框內容一樣時,這時候就可以共用一個模態框,減少代碼量,具體代碼如下
新增//新增不需要傳遞任何參數編輯//編輯時候,需要傳遞當前行的id
模態框內容
data中的數據
addForm:{
name:"",
creditCode:"",
address:"",
tel:"",
id:""
},
dialogAddgsVisible:false,
title:""
點擊新增彈框按鈕,改變模態框的title
addGsForm(){
this.dialogAddgsVisible = true;
this.title="新增"
},
點擊編輯模態框,改變模態框title,并且把當前行的數據賦值給模態框的input輸入框
bjGsForm(val){
console.log(val)
this.dialogAddgsVisible = true;
this.title="編輯"
this.addForm.name=val.name
this.addForm.creditCode=val.creditCode
this.addForm.address=val.address
this.addForm.tel=val.tel
this.addForm.id=val.id
},
關閉或取消彈框
closeDialogAddgsVisible(){
this.$refs.addForm.resetFields();//element封裝的方法,清空模態框的值
this.title="" //初始化title的值
this.addForm={//初始化addForm中的值
name:"",
creditCode:"",
address:"",
tel:"",
id:""
}
},
點擊確定按鈕(確定添加或編輯)
saveAddForm() {
this.$refs.addForm.validate(valid => {
if (valid) {
let params = {
id: this.addForm.id,
name: this.addForm.name,
creditCode: this.addForm.creditCode,
address: this.addForm.address,
tel:this.addForm.tel,
};
if(!this.addForm.id){//當沒有傳過來id的時候,說明是添加,所以發送添加請求
this.$post(
"/api/company/admin/saveCompany",
params,
data => {
// console.log(data, 1122);
this.$message.success("新增企業成功！")
this.dialogAddgsVisible = false
this.handleCurrentChange(1);
}
);
}else{//發送編輯請求
this.$post(
"/api/company/admin/updateCompany",
params,
data => {
// console.log(data, 1122);
this.$message.success("修改企業成功！")
this.dialogAddgsVisible = false
this.handleCurrentChange(1);
}
);
}
}
});
},
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/104460.html
摘要：要實現的效果如下初始化的時候不可編輯點擊編輯按鈕編輯按鈕隱藏取消編輯按鈕顯示部分輸入框變為可編輯營銷單詳情工單號客戶姓名聯系電話客戶地址營銷人員工號 要實現的效果如下,初始化的時候,不可編輯,點擊編輯按鈕,編輯按鈕隱藏,取消編輯按鈕顯示;部分input輸入框變為可編輯showImg(https://segmentfault.com/img/bVbtBnR?w=915&h=437); s...
摘要：實現效果如下結構操作成員刪除獲取當前行的打開新增成員確定新增請選擇用戶添加成功從數組中添加當前行刪除員工確定刪除嗎刪除成功從數組中刪除當前行 實現效果如下showImg(https://segmentfault.com/img/bVbtHZ3?w=1081&h=359); 結構 成員 刪除 ...
摘要：在前端頁面中，把用純對象表示，負責顯示，兩者做到了最大限度的分離。的顯示與否和的布爾值有關，還是只關注數據的變化。兩個組件的布爾值通過兩個臨近的按鈕控制，初始值和的結果都是。組件的聲明在組件上，則完全沒有進入生命周期。 開始前說一說 吐槽 首先， 文章有謬誤的地方， 請評論， 我會進行驗證修改。謝謝。 vue真是個好東西，但vue的中文文檔還有很大的改進空間，有點大雜燴的意思，對于怎么...
摘要：中定義方法解構賦值使用方法在函數中傳入兩個數組第一個數組中的每一項一一對應等于第二個數組的每一項例如張三得到張三表格中的內容操作催辦中的數據當前操作行模態框控制顯示隱藏點擊催辦按鈕調用函數傳入兩個數組得到讓模態框顯示并把當前 main.js中定義方法 /**解構賦值 * @param {*} arr1 key * @param {*} arr2 value*/ Vue.pro...
閱讀 3503·2021-11-24 09:39
閱讀 781·2019-08-30 14:22
閱讀 3031·2019-08-30 13:13
閱讀 2310·2019-08-29 17:06
閱讀 2918·2019-08-29 16:22
閱讀 1255·2019-08-29 10:58
閱讀 2427·2019-08-26 13:47
閱讀 1628·2019-08-26 11:39
