Использование Axios CDN для отображения в шаблоне Vue

Question

Использование Axios CDN для отображения в шаблоне Vue

1

Я хочу отображать информацию JSON, извлекаемую из библиотеки Axios. Используя мой {{ id }}, я хочу вызвать определенный параметр в запросе.

У меня есть внешний файл JS.

const Home = { 
    template: '

    <div class="user">
        <h2>user {{ id }}</h2>
        bet
    </div>

    ',
    props: {
        id: {
            type:    String,
            default: 'N/A'
        }
    } 
}

CDN включает в себя:

<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
<script src="../../jobs/job.js"></script>

Маршрутизатор довольно прост:

const router = new VueRouter({
        mode: 'history',
        routes: [
            {
                path: '/jobs/:id?',
                component: Home,
                props:     true
            },
        ],
    })

СПАСИБО

Bryan Sanders 12 янв. 2019, в 07:37

Источник

0

Как вы называете этот id настоящее время? Пожалуйста, опубликуйте ожидаемый результат.
Yom S. 12 янв. 2019, в 07:00

Теги:

javascript

vue.js

vue-router

axios

1 ответ

Ещё вопросы

Как вы называете этот id настоящее время? Пожалуйста, опубликуйте ожидаемый результат.

Ohgodwhy · Answer 1 · 2019-01-12T06-15-00.000Z

Неясно, является ли ID свойством или параметром маршрута. Я думаю, что вы используете параметр маршрута здесь. Если это так, и вы не передаете его непосредственно в компонент, то я думаю, что вы можете безопасно удалить его и заменить его вычисленным свойством, которое будет возвращать идентификатор. Затем просто добавьте method который будет выполнять ваш запрос axios. И вызовите этот запрос в mounted методе вашего компонента.

Мои мысли:

const Home = { 
  template: '

  <div class="user">
    <h2>user {{ id }}</h2>
    bet
  </div>

  ',
  mounted: function() {
    this.myRequest()
  }, 
  computed: {
    id: {
      get: function() {
        return this.$route.params.id
      }
    }
  },
  methods: {
    myRequest() {
      axios.get('/path/to/my/request', { params: { id: id }})
        .then(response => {
          console.log(response)
        }).catch(error => {
          console.log(response)
        })
    }
  }
}

Я собираюсь включить идентификатор в 'axios.get' -> попробую.
Получение нескольких ошибок @ohgodwhy - myRequest is not defined + $route is not defined + "ReferenceError: $route is not defined"