javascript - elementui input帶提示框 選中傳參問題
問題描述
最近用了elementui做項目,遇到一些問題。
需求:選中提示內容之后 給datatable對應行row的id賦值,(后臺要求傳id,不傳input的值)。
問題:自定義table嵌套 帶提示的input,select函數api上自帶一個參數,我額外添加一個參數row之后,就獲取不到當前的選中的數據?
<el-table-column prop='futuresContractId' label='采購合約' width='120'> <template scope='scope'> <el-autocomplete v-model='scope.row.id' :value='scope.row.futuresContractId' :fetch-suggestions='querySearch' placeholder='請輸入' :trigger-on-focus='false' @select='handleSelect(scope.row)' > </el-autocomplete> </template> </el-table-column>
querySearch(queryString, cb) {var restaurants = [ {id:2,name:'M1701',value:'M1701'}, {id:4,name:'M1705',value:'M1705'} {id:8,name:'M1709',value:'M1709'}];var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants; // 調用 callback 返回建議列表的數據cb(results); }, createFilter(queryString) { return (restaurant) => { return (restaurant.value.indexOf(queryString.toLowerCase()) >= 0); }; }, handleSelect(row) { console.log(row) //?這里可以把當前行row傳過來,疑問是如何把選中的值id傳給當前的row的id? //如不帶參數過來,默認參數就是選中的restaurants元素 },
問題解答
回答1:你這種思路還是老的思路,沒有享受 VueJS 的大法。
Autocomplete 組件,當你選擇以后,直接就會把 Value 賦值給你的 v-model='scope.row.id' 的了。所以你的疑問 疑問是如何把選中的值id傳給當前的row的id? 不是疑問。
handleSelect(row) { // 默認參數就是當前的row // row 的 ID 已被改變,無需手動處理}
我根據的你的代碼,弄了一個可執行的,你看下,如果理解不正確,及時指出。
https://jsfiddle.net/j6toc479/3/
相關文章:
1. 在mac下出現了兩個docker環境2. css3 - css怎么實現圖片環繞的效果3. android - 用textview顯示html時如何寫imagegetter獲取網絡圖片4. javascript - 原生canvas中如何獲取到觸摸事件的canvas內坐標?5. css - 定位為absolute的父元素中的子元素 如何設置在父元素的下面?6. JavaScript事件7. javascript - jquery hide()方法無效8. 網頁爬蟲 - 用Python3的requests庫模擬登陸Bilibili總是提示驗證碼錯誤怎么辦?9. 注冊賬戶文字不能左右分離10. html - vue項目中用到了elementUI問題
