javascript - 如何使用查询从 vue router-link 重定向?

标签 javascript vue.js router query-string routerlink

如何向路由器链接添加查询,以便用户通过单击通知中的链接重定向到帖子下的评论?

API 为我们提供了通知的 anchor 和评论的id。当 DOM 渲染页面时,它首先加载帖子,然后加载评论。

这是通知的一个组成部分:

<template>
 <div>
  <span>
   <i class="g-font-size-18 g-color-gray-light-v1"></i>
    </span>
     <router-link :to="linkFromNotification(item)
                  @click.native="linkFromNotification(item.notification_type)">
    <p>
     <span v-html="item.message"></span>
    </p>
  </router-link>
 </div>
</template>

<script>
import {mapActions, mapGetters} from 'vuex'


 export default {
 props: ['item'],
 computed: {
 ...mapGetters([
 'getNotifications'
  ])
 },
 methods: {
 ...mapActions([
 'readNotification'
 ]),
 linkFromNotification (item) {
    if (item.notification_type === 'user_subscribed') {
      return {name: 'person', params: {id: item.object_id}}
    } else if (['comment_created', 'answer_selected', 'answer_created'].includes(item.notification_type)) {
      return {name: 'show_post', params: {id: item.object_id}}
    } else if (item.notification_type === 'user_coauthored') {
      return {name: 'show_post', params: {id: item.object_id}}
     }
    }
   }
  }
 </script>

最佳答案

如果您指的是 url 查询,您可以在返回的对象中使用键查询, 如果您的意思是在链接中添加哈希值“#”,则可以使用 key 哈希值。例如:

{name: 'person', params: {id: item.object_id}, query:{name:"Mohd"}, hash:"214"}

Reference

关于javascript - 如何使用查询从 vue router-link 重定向?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48519845/

相关文章:

javascript - 更改服务器在 kendo ui 网格中以编程方式排序

javascript - 如何以编程方式从 React Router 4.0 中的事件处理程序导航到路由?

javascript - Firestore 查询具有多个值的循环

javascript - 打印机不可用时如何测试JavaScript的window.print函数?

javascript - 如何在 Next 和 Prev 按钮时水平滚动托盘?

javascript - 避免重复将相同的 props 传递给子组件 Vuejs

javascript - Vue.js 从子组件访问父/根数据

javascript - 如何使用带有 getter 和 setter 的计算属性来触发 Vuex 中的提交

刷新另一个页面时, Angular 路由重定向到主页

javascript - Angular 2 - 使用 Angular-route 3.3.0 覆盖路线