import Vue from 'vue'
import Router from 'vue-router'
import ArticleList from '@/components/ArticleList'
import ArticleShow from '@/components/ArticleShow'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/articles',
      name: 'ArticleList',
      component: ArticleList
    },
    {
      path: '/article',
      name: 'ArticleShow',
      component: ArticleShow
    }
  ]

<router-link :to="{name: 'ArticleShow", query: { id: article.id } }>
  <p>
    {{ article.created_at }}&nbsp;&nbsp;
    {{ article.title }}
  </p>
</router-link>

<template>

  ……

  <td @click='show_article(article.id)'>
    {{ article.created_at }}&nbsp;&nbsp;
    {{ article.title }}
  </td>

</template>

<script>

  ……

    methods: {
      show_article: function (articleId) {
         this.$router.push({name: 'ArticleShow', query: {id: articleId}})
       }
     }

}

</script>