nuxt.js - >没有axios的自定义路线如何获得' id'

时间:2017-04-02 18:48:44

标签: nuxt.js

所以在我的nuxt.js项目中,我需要一个自定义路由,如https://nuxtjs.org/examples/custom-routes

所述

到目前为止,我所做的是以下内容。

file:pages \ trails.vue

...
<nuxt-link v-bind:to="'/trail/' + trail.article_code">{{ trail.article_description }}</nuxt-link>
...

这对index.vue文件来说是相同的。如果我更正,此文件中没有其他相关代码

file:pages \ trail \ _id

<template>
    <div class="vttTrails">
        <div class="ui grid centered">
            <div v-for="(trail, index) in listTrail">
                <div class="ui card">
                    {{ trail.article_code }}
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    import feathers from 'feathers/client';
    import socketio from 'feathers-socketio/client';
    import hooks from 'feathers-hooks';
    import io from 'socket.io-client';
    import * as process from "../../nuxt.config";

    const vttSocket = io(process.env.backendUrl);
    const vttFeathers = feathers()
        .configure(socketio(vttSocket))
        .configure(hooks());

    const serviceArticles = vttFeathers.service('articles');

    export default {
        layout: 'default',
        data: function() {
            return {
                listTrail: [],
                curLanguage: this.$store.state.site.curLanguage,
                curCategory: this.$store.state.site.curCategory
            }
        },
        mounted: function() {
            return serviceArticles.find({
                query: {
                    category_id: this.$store.state.site.curCategory,
                    article_code: '',
                    $sort: {
                        article_rating: 1
                    },
                    $select: [
                        'id',
                        ['article_description_' + this.$store.state.site.curLanguage, 'article_description'],
                        'article_length',
                        'article_ascend',
                        'article_code',
                        'article_at',
                    ]
                }
            }).then(page => {
                this.listTrail = page.data;
            })
        },
    }
</script>

所以我在这里放了整个文件,以防万一。点击链接将转到例如&#34;线索\ CWU&#34;这是正确的,因为我有。价值&#34; cwu&#34;需要进入article_code: ''。我尝试mounted: function(params),但它没有用。

问题

我需要做些什么才能获得&#39; params&#39;参与我的_id.vue&#39 ;?最后我会调整选择,因为它只返回一个。

1 个答案:

答案 0 :(得分:0)

好。所以我现在所做的就是更改'_id.vue'文件中的数据功能。它现在包含:

data: function() {
            return {
                listTrail: [],
                curLanguage: this.$store.state.site.curLanguage,
                curCategory: this.$store.state.site.curCategory,
                curTrail:  window.location.pathname.split('/')[2]
            }
        },

这可能不是正确的方法,但确实有效。