Как написать недвижимость по ссылке?

Question

Я новичок в Vue.js и выполняю задачу, в которой мне нужно написать свойство для ссылки, но я не знаю, как это сделать?Как записать «счетчик» из «данных» в ссылку, чтобы она работала.

export default {
  name: 'app',
  data () {
    return {
      counter: 1,
    }
  },
  created(){
    axios.get('http://jsonplaceholder.typicode.com/posts? 
      _start=${counter}+0&_limit=10').then(response => {
      this.posts = response.data
    })
  }
}

Answer 1

Axios позволяет добавлять параметры запроса URL в виде объекта:

axios.get('http://jsonplaceholder.typicode.com/posts', {
    params: {
      _start: this.counter, //or `${this.counter}+0` if you need that +0 as a string at the end
      _limit: 10

    }
  })
  .then(function (response) {
    this.posts = response.data
  })
  .catch(function (error) {
    console.log(error)
  })

Это даст тот же результат, но выглядит немного более элегантно и его легче поддерживать, если у вас много параметров в ваших URL ?

Я держу этот листок с надписями рядом, когда я с ним работаю.

Answer 2

Вам необходимо использовать Шаблонные литералы , и они "являются строковыми литералами, допускающими встроенные выражения", как предложено Мэттом, вместо использования "или" use (backtick или `), см. Больше здесь: Шаблонные литералы . Более того, используя this, вы можете получить доступ к переменной, поскольку counter принадлежит объекту данных, который является глобальным объектом, а " глобальный объект является объектом, который всегда существует в глобальном Область "и используя" это"ключевое слово, вы можете получить доступ к глобальному объекту на глобальном уровне. Подробнее здесь и здесь так:

created(){
  axios.get(`http://jsonplaceholder.typicode.com/posts?_start=${this.counter}+0&_limit=10`).then(response => {
    this.posts = response.data
  })
},