Vue: error in render: “typeerror: cannot read property ‘length’ of undefined”

There are usually two situations:

1. Using length to report an error on the HTML tag of the template

When length is used in Vue, an error is sometimes reported as follows:

<div class="item_list" v-if="form.checkVal.length > 0" >list 1</div>
<div class="item_list" v-else >list 2</div>

resolvent:

Change to: form.checkVal !== undefined  &&   form.checkVal.length > 0

<div class="item_list" v-if="form.checkVal !== undefind && form.checkVal.length > 0" >list 1</div>
<div class="item_list" v-else >list 2</div>

2. Use length in JS to report an error, as follows

if(res.Data.length == 1){
   this.tableData1 = res.Data[0];
}

Error reason: at this time res.Data No data is undefined, so it cannot be found res.Data.length .

Solution: in addition to a layer of judgment, the first guarantee res.Data The existence is not null or undefined is changed to, as follows

 if(res.Data){
   if(res.Data.length == 1){
       this.tableData1 = res.Data[0];
   }
 }