How does the front end give the null field to a default value when it receives the value from the server? is there a useful third-party library or a good solution to this problem?

problem description

restful development mode, however, when the front end gets the data sent from the server, many of them do not give default values, and many of them are caused by null, such as the string .toString (), length, and so on.
if each field determines whether it is null, before each use, it feels inefficient and easy to forget, is there a good way to deal with it uniformly.

in the past, when working as a server, you can configure some parameters before serialization and set the default values when there is no data, but the server sometimes forgets to configure, or they are unwilling to do this step. and it is really unreliable to rely entirely on the server to do these things. The front end should have its own better fault-tolerant mechanism.

the environmental background of the problems and what methods you have tried

originally wanted to write a common method to determine the return data type when the request is returned. If it is an object, it traverses each property, determines the value, and sets the default property. If it is not an object, do other settings.

but in this way, every returned data will be processed in this way, which does not feel very efficient.

what result do you expect? What is the error message actually seen?

expect an elegant and efficient solution. If it is the same as what I said above, please wait with me for a better way.


if you are using axios , you can use transformResponse . Then change the return value as you want.

for example, the returned json, recursively determines whether null, is changed to '

. The problem with

is that your front end doesn't know whether the default value is '' or 0 .
communicate with the backstage.


the landlord's question is similar to the one I answered before. How to do defense programming better and more elegantly? You can refer to this article https://codeshelper.com/q/10.. I hope it will enlighten you a little bit.


strictly speaking, this problem should be standardized by the background data format

if it is a problem left over from history and cannot be modified in the background, it can only be handled by the front end, then you can use try.catch. to deal with

.
//
data = {
    img:[
        {
            name:'',
            src:''
        }
    ],
    title:{
        txt:''
    }
}

//

data = {
    img:null,
    title:null
}

//

var source = {};

try{
    source.img = data.img[0]['name'];
    source.title = data.title['txt'];
}catch{
    source.img = '';
    source.title = '';
}

so that no mistakes can be made

Menu