vue前端傳空值、空字符串的問題及解決
vue前端傳空值及空字符串問題
在與后端調(diào)試接口時,經(jīng)常接口里的參數(shù)會有空值,如果每次都要后端寫判斷,代碼容易冗余。
所以就在前端做判斷,在傳值時先判斷接口參數(shù)是否為空,為空則不傳,有值則傳參。
這里的例子是vue 列表接口獲取全部列表值
一般列表頁面都做了搜索和分頁功能,所以帶的參數(shù)就有:搜索字段、當(dāng)前頁碼、頁碼最大數(shù)值(param,pageNo,pageSize)只是舉例,不一定是一模一樣
在加載列表接口時,這些條件會拼接到接口url中,所以要對搜索字段進行判斷,是否有值
1.先定義param,當(dāng)做接口參數(shù),里面存放搜索字段和分頁字段
2.對搜索字段進行判空操作,如果有值,則存入param,加載時會拼接到接口url中
(哪個字段有值拼哪個)
列表接口如下
export function getTbComponentList(params) { return request.get('/compmgr/components', {params}) }
效果如下 :
vue空值報錯問題
如上圖所示,提示percent為空,web效果圖如下
如果是自測階段不想麻煩就直接在數(shù)據(jù)庫添加數(shù)據(jù)就行或者或者初始化方法賦初始值,最簡便的還是在vue template里進行判斷
代碼如下:
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue 百度地圖(vue-baidu-map)繪制方向箭頭折線實例代碼詳解
這篇文章主要介紹了vue 百度地圖(vue-baidu-map)繪制方向箭頭折線,本文通過實例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-04-04Vue?router應(yīng)用問題實戰(zhàn)記錄
vue-router是vue.js官方的路由插件,他和vue.js是深度集成的適合構(gòu)建單頁面應(yīng)用,下面這篇文章主要給大家介紹了關(guān)于Vue?router應(yīng)用問題的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-04-04詳解如何創(chuàng)建并發(fā)布一個 vue 組件
這篇文章主要介紹了詳解如何創(chuàng)建并發(fā)布一個vue組件,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-11-11vue3如何使用postcss-px-to-viewport適配屏幕
這篇文章主要介紹了vue3如何使用postcss-px-to-viewport適配屏幕問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2023-03-03在vue中使用export?default導(dǎo)出的class類方式
這篇文章主要介紹了在vue中使用export?default導(dǎo)出的class類方式,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-03-03