为什么在Vue-Router参数之后无法访问数据？

Question

当我搜索工作并转到详细信息（至另一页）时，我找不到任何结果。

我认为我需要vuex存储，但我不了解该属性。

这是工作详细信息页面（以及json中的值）

export default {
  data() {
    return {
      positionName: this.$route.params.positionName,
      id: this.$route.params.jobId,
      items: []
    };
  },
  created() {
    this.$http
      .get(
        "http://www.json-generator.com/api/json/get/cqdiacEgfC?indent=2" +
          this.positionName +
          this.id
      )
      .then(function(data) {
        this.items = data.body;
      });
  }
};

<div>
    <div class="card-body"
            v-for="item in items"
            :key="item.id">
      <h5 class="card-title">{{positionName}}</h5>
      <p class="card-text">{{item.companyName}}</p>
      <p class="card-text">{{item.description}}</p>
      <p class="card-text">{{item.countryName}}</p>
      <p class="card-text">{{item.cityName}}</p>
      <p class="card-text">{{item.address}}</p>
      <p class="card-text">0{{item.contactPhone.areaCode}}-{{item.contactPhone.number}}</p>
      <input type="button"
              value="Başvur!"
              class="btn btn-danger">
    </div>
  </div>

这是路由器页面

import Vue from "vue";
import Router from "vue-router";
import Hey from "./components/hey.vue"
import Search from "./components/search.vue"

Vue.use(Router);

export default new Router({
  mode: "history",
  base: process.env.BASE_URL,
  routes: [
    {
      path: "/",
      name: "Home",
      component: Search
    },
    {
      path: "/:positionName/:jobId",
      name: "JobDetail",
      component: Hey
    }
  ] 
});

我能知道什么？为什么路由器之后我无法在另一页中到达json值？