vue 學習筆記2
阿新 • • 發佈:2020-10-21
1. vue接收springboot的資料。
vue程式碼:
<template> <table> <tr> <td>id</td> <td>path</td> </tr> <tr v-for="item in videos" :key="item.id"> <td>{{item.id}}</td> <td>{{item.path}}</td> </tr> </table> </template> <script> import axios from'axios' export default { data() { return { videos: [ { id: 1, path: "path1" }, { id: 2, path: "path2" } ] } }, created() { const _this= this axios.get('http://localhost:7077/shortvideo/index') .then(response=>{ _this.videos = response.data }) .catch(error=>{ console.log("error: "+error) }) } } </script>
springboot解決跨域:
@Configuration public class Myconfig implementsWebMvcConfigurer { @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/**") .allowedOrigins("*") .allowCredentials(true) .allowedMethods("GET", "POST", "DELETE", "PUT", "PATCH") .maxAge(3600); } }