vue为什么向后台发送请求参数不对？？

Question

从Folder跳转到File页面 在File页面created中向后台发送的get请求 参数名设置的name 但是我在控制台看到发出去的是参数名是item这是怎么回事？
Request URL: http://localhost/douyin_laravel/public/index.php/api/file?item=20190715

Folder.vue

<template>
  <div class="app">
    <div class="top">
      <span>目录</span>
    </div>
    <div class="bottom">
      <div class="nt1">
        <span class="name">文件名</span>
        <span class="time">时间</span>
      </div>
      <div class="nt" v-for="(item, index) in list" :key=index>
        <div class="nt_top">
          <div><el-checkbox v-model="item.checked" @change="change"></el-checkbox></div>
            <div class="name" @click=gofile(item.name)>
              {{item.name}}
            </div>
        </div>
        <div class="hr">
        </div>
    </div>
      <div class="manage">
        <el-checkbox v-model="checkall" @change="all">全选</el-checkbox>
        <el-button size="mini" type="danger">删除</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  name: 'Folder',
  data () {
    return {
      checkall: false,
      list: [
      ]
    }
  },
  methods: {
    change () {
    },
    all () {
      if (!this.checkall) {
        this.list.map((res) => {
          res.checked = false
        })
      } else {
        this.list.map((res) => {
          res.checked = true
        })
      }
    },
    gofile (name) {
      this.$router.push({name: 'File', query: {name: name}})
    }
  },
  mounted () {
    axios.get('http://localhost/douyin_laravel/public/index.php/api/folder').then((res) => {
      this.list = res.data
    })
  }
}
</script>

<style scoped>
.app{width: 100%;height: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.top{width: 80%;height: 50px;align-items: center;display: flex;}
.bottom{width: 80%;border: 1px solid #ccc;}
.nt1{display: flex;width: 100%;flex-direction: row;border-bottom: 1px solid #ccc}
.nt{display: flex;width: 100%;flex-direction: column;}
.name{flex-grow: 6}
.time{flex-grow: 1}
.nt_top{display: flex;width: 100%;}
.hr{width: 100%;height: 1px;background-color: #ccc}
.manage{display: flex;justify-content: space-between;align-items: center;height: 50px;}
</style>

File.vue

<template>
  <div class="app">
    <div class="top">
      <span>目录</span>
    </div>
    <div class="bottom">
      <div class="nt1">
        <span class="name">文件名</span>
      </div>
      <div class="nt" v-for="(item, index) in list" :key=index>
        <div class="nt_top">
          <div><el-checkbox v-model="item.checked" @change="change"></el-checkbox></div>
            <div class="name">
              {{item.name}}
            </div>
            <div  class="time">
              {{item.time}}
            </div>
        </div>
        <div class="hr">
        </div>
    </div>
      <div class="manage">
        <el-checkbox v-model="checkall" @change="all">全选</el-checkbox>
        <el-button size="mini" type="danger">删除</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  name: 'File',
  data () {
    return {
      checkall: false,
      list: [
      ]
    }
  },
  methods: {
    change () {
    },
    all () {
      if (!this.checkall) {
        this.list.map((res) => {
          res.checked = false
        })
      } else {
        this.list.map((res) => {
          res.checked = true
        })
      }
    }
  },
  created () {
    axios.get('http://localhost/douyin_laravel/public/index.php/api/file?name=' + this.$route.query.name).then((res) => {
      this.list = res.data
    })
  },
  mounted () {
  }
}
</script>

<style scoped>
.app{width: 100%;height: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.top{width: 80%;height: 50px;align-items: center;display: flex;}
.bottom{width: 80%;border: 1px solid #ccc;}
.nt1{display: flex;width: 100%;flex-direction: row;border-bottom: 1px solid #ccc}
.nt{display: flex;width: 100%;flex-direction: column;}
.name{flex-grow: 6}
.time{flex-grow: 1}
.nt_top{display: flex;width: 100%;}
.hr{width: 100%;height: 1px;background-color: #ccc}
.manage{display: flex;justify-content: space-between;align-items: center;height: 50px;}
</style>

Answer 1

那你就打印this.$route.query,看看里面是什么