Write a public method about the pager in element-ui in Vue, but get less than the number of entries displayed per page?

 <el-pagination 
    :current-page="currentPage" 
    @size-change="$utils.handleSizeChange(val)" 
    :page-sizes="[100, 20, 30, 40]" 
    layout="total, sizes, prev, pager, next, jumper" 
    :total=pageTotal>
</el-pagination>





export default {
handleSizeChange(val) {
    alert(val)
}

}
this is the public method I wrote

when I try to get val, prompt me for val undefind;

In the case of

element-ui, the number of val currently displayed is obtained as follows:

clipboard.png

< el-pagination

    :current-page="currentPage" 
    @size-change="handleSizeChange" 
    :page-sizes="[100, 20, 30, 40]" 
    layout="total, sizes, prev, pager, next, jumper" 
    :total=pageTotal>
</el-pagination>

methods: {

   handleSizeChange(val){
      console.log(val);
   }

}

Mar.15,2021

<el-pagination 
    :current-page="currentPage" 
    @size-change="$utils.handleSizeChange"  //  val
    :page-sizes="[100, 20, 30, 40]" 
    layout="total, sizes, prev, pager, next, jumper" 
    :total=pageTotal>
</el-pagination>
Menu