nuxt가 서버에서 데이터 데모를 요청합니다

1852 단어 nuxt.jsaxiosvue.js
블로거는 하룻밤의 분투 끝에 많은nuxt 문제, 파라미터의 전달, 페이지 리셋 리셋, 데이터 요청 등을 해결했다.
더 이상 말하지 않고 바로 코드를 넣습니다.
페이지에 index를 추가합니다.vue


import AppLogo from '~/components/AppLogo.vue'
import axios from 'axios'

export default {
  components: {
    AppLogo
  },
  methods: {
    login () {
      axios({
        withCredentials: true,
        method: 'get',
        url: `url`,
      }).then((res) => {
        this.$router.push('/show')
      })
    }
  }
}

페이지에 show를 추가합니다.vue



import axios from 'axios'
import sun from './sun'

export default {
  data () {
    return {
      account: ''
    } 
  },
  methods: {
    async getData () {
      let { data } = await axios({
        withCredentials: true,
        method: 'get',
        url: `url`
      })
      this.account = data.account
    }
  },
  components: {
    sun
  },
  created () {
    this.getData ()
  }

}



페이지에sun을 추가합니다.vue



export default { 
  name: 'sun',
  props: ['papa'],
  data () {
    this.$watch('papa', function(newVal, oldVal){
      console.log(newVal)
      this.pada = newVal
    });
    return {
      pada: ''
    }
  }
}



좋은 웹페이지 즐겨찾기