springboot+vue+element-ui +axios显示数据

本来是一个简单的显示，没必要写博客的，但是碰到了一个有趣的问题，耽搁我一下。就写出来让大家注意一下。
Java 后台代码

  @RequestMapping("/findallVideo")
        @ResponseBody
        public Map<String,Object>  findAll(){
        	Map<String,Object> returnMap=new HashMap<String,Object>();
        	logger.info("开始查询在线视频资源");
        	List<Video> list=null;
        	list=videoService.findAll();
        	logger.info("结束查询在线视频资源");
        	returnMap.put("tableVideo", list);
        	return returnMap;
        }

前端html代码

 <el-table :data="tableData" style="width:100%" height="500" border="true">
								<el-table-column	prop="videoid" label="序号" width="50"> </el-table-column>							      
								<el-table-column	prop="videoname" label="名字"  width="180">  </el-table-column>							      
								<el-table-column   prop="viewstimes"  label="浏览次数"   width="80">  </el-table-column>								     
								<el-table-column   prop="videodescribe"  label="描述"   width="280">  </el-table-column>								      
								<el-table-column   prop="videoaddress"  label="位置"   width="320">  </el-table-column>								    
								<el-table-column   prop="uploadtime"  label="上传时间"   width="180">  </el-table-column>								    
								<el-table-column   prop="capacity"  label="文件大小"   width="180">  </el-table-column>							      
					     </el-table> 

前端js代码

 showVideo:function (){
			    	 var self=this;
			    	 axios.post('/findallVideo').then(function (response) {
			    		    self.tableData=response.data.tableVideo;  			    			
			    		    console.log(this.tableData);
			    	 })
			    		  
			       }

在这个axios请求的时候，如果直接使用this.tableData是无法显示数据，但是它又不会报错。只有页面显示无数据。
后面我留意到可能是不在同一个数据区域，回调函数无法正常赋值。所使用了var vself=this; 然后直接赋值就可以。