vue axios.get 数据,前后台数据交互

647 阅读1分钟

我看的是尚学堂-vue axios专题视频教程



vue axios.get 数据,前后台数据交互


<template>
  <div class="hello">
  	<h1>{{msg}}</h1>
  	<h3>{{content}}</h3>
  	
  	<div  >
  		<img v-for="index in imgArr" :src="index"/>
  	</div>
    
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App',
      content:'',
      imgArr:''
    }
  },
  created(){
  this.$axios.get("http://wwtliu.com/sxtstu/blueberrypai/getChengpinDetails.php")//请求的地址
  .then(res => {
    console.log(res);//打印出请求回来的数据
		this.content = res.data.chengpinDetails[0].content;//获得字符串
    this.imgArr = res.data.chengpinDetails[0].img;//获得数组
  })
  .catch(error => {
    console.log(error)
  })
  }
}
</script>

</style>