_Zora. 2024-07-11 10:26 采纳率: 94.4%
浏览 4
已结题

vue路由发送请求不跳转

vue中向路由发送请求跳转不到相应的页面
代码1:路由的配置


```javascript

export default new VueRouter({
  routes: [
    //路由重定向
    {
      path: "*",
      redirect: "/home",
    },
    {
      path: "/search",
      name: "search",
      meta: { footer_show: true },
      component: SearchPage,
    },
  ],
});


代码2:请求路由(编程式路由导航向网络申请,this.$router.push向服务器发起请求)

```javascript
              <h3>
                <!-- v-bind="{ 'data-itemA': item1.categoryName }" -->
                <a href="javascript:void(0)" :data-itemA="item1.categoryName" :data-item1Id="item1.
              categoryId" @click="goSearch">{{
                  item1.categoryName }}</a>
              </h3>


  methods: {
    //点击路由跳转
    goSearch(event){
      let { itema, item1id, item2id, item3id } = event.target.dataset
      const  query={
        categoryName: itema,
      }
      // 检查是否存在 item1id、item2id 或 item3id,并添加到查询参数中
      if (item1id) query.item1id = item1id
      if (item2id) query.item2id = item2id
      if (item3id) query.item3id = item3id

       this.$router.push({
        name: 'search',
        query: query
      })

      }

问题:向服务器发起请求,同时参数也传递过去了,但是就是不会跳转到search这一个页面

img

第一次做项目,希望得到大家的帮助,谢谢大家!

  • 写回答

4条回答 默认 最新

  • 专家-赤兔[在线] 全栈领域优质创作者 2024-07-11 10:26
    关注

    引自免费微信小程序:皆我百晓生

    你的问题可能涉及到Vue路由的多个方面,包括配置、请求处理以及路由跳转。下面我会从这几个方面来分析和解决问题。

    首先,确认你的VueRouter是否已经正确配置和初始化。从你给出的代码来看,你的路由配置看起来是正确的。但是需要注意,你的路由配置中的 * 通配符可能会影响到正常的路由匹配。你可能需要更详细地定义你的路由规则,以便正确地匹配到不同的页面。另外,确认你的服务器已经正确配置了请求的路由处理程序,以便处理你的请求并返回正确的响应。如果服务器无法正确响应请求,这可能会导致路由无法正确跳转。

    然后,关于你的代码部分,你在 goSearch 方法中使用了 this.$router.push 进行路由跳转,这个方法是正确的。然而,你的跳转方式可能会因为传递参数的方式导致问题。在你的代码中,你尝试通过 query 参数传递查询参数(例如 categoryName),然后在服务器端接收这些参数进行处理。然而,如果你希望这些参数在服务器端被处理并且页面根据这些参数进行变化(例如搜索页面显示不同的搜索结果),你需要确保服务器端正确处理这些查询参数并将处理结果正确地返回到前端。如果你的服务器端并未正确处理这些参数,这可能导致你的路由跳转未能成功到达期望的页面。在这种情况下,你需要检查你的服务器端代码以确保它正确处理这些查询参数并返回正确的响应。

    最后,关于你提到的URL localhost:8081/#/search?categoryName=电子书&item3id=1 ,这可能是你在浏览器中输入的URL进行手动跳转或者刷新页面时产生的结果。如果你的服务器正确处理了查询参数并返回了正确的响应,这个URL应该能够正确跳转到搜索页面并显示相应的搜索结果。如果你仍然无法跳转到正确的页面,你可能需要检查你的VueRouter配置是否正确,或者尝试清除浏览器的缓存和cookies并重新加载页面。

    总的来说,你需要确保VueRouter的配置是正确的,服务器端的请求处理也是正确的,同时也要注意URL和查询参数的传递方式。如果你还有任何关于这个问题的其他疑问或者需要进一步的帮助,请随时向我提问。

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(3条)

报告相同问题?

问题事件

  • 系统已结题 8月4日
  • 已采纳回答 7月27日
  • 创建了问题 7月11日

悬赏问题

  • ¥20 WPF MVVM模式 handycontrol 框架, hc:SearchBar 控件 Text="{Binding NavMenusKeyWords}" 绑定取不到值
  • ¥15 需要手写数字信号处理Dsp三个简单题 不用太复杂
  • ¥15 数字信号处理考试111
  • ¥100 关于#audobe audition#的问题,如何解决?
  • ¥15 allegro17.2生成bom表是空白的
  • ¥15 请问一下怎么打通CAN通讯
  • ¥20 如何在 rocky9.4 部署 CDH6.3.2?
  • ¥35 navicat将excel中的数据导入mysql出错
  • ¥15 rt-thread线程切换的问题
  • ¥15 高通uboot 打印ubi init err 22