cari

Rumah  >  Soal Jawab  >  teks badan

Gunakan vue-router untuk memaut data jadual dalam API

Saya mendapat dan memaparkan data daripada API (https://restcountries.com/) tetapi saya tidak boleh memautkan setiap entri jadual ke halamannya sendiri menggunakan teg pautan penghala. Tiada apa-apa yang berlaku, tiada ralat, tiada teks pautan.

<template>
    <div>
        <b-table responsive head-variant="dark" striped hover :items="countries" :fields="headings">
            <template #cell(name)="data">
                <router-link :to="{name: 'country', params: {country: country.name.official}}">
                    {{ data.value }}
                </router-link>
            </template>
        </b-table>
    </div>
</template>

<script>
import axios from '@/config'

export default {
    name: 'AllCountries',
    components: {},
    data() {
        return {
            headings: [
                {
                    key: 'name.common',
                    sortable: true
                },
                {
                    key: 'capital',
                    sortable: true
                },
            ],
            countries: []
        }
    },
    mounted() {
        axios.get('/all')
        .then(response => {
            console.log(response.data)
            this.countries = response.data
        })
        .catch(error => console.log(error))
    }
}
</script>

Jika saya mengalih keluar .common daripada kekunci "nama", pautan penghala berfungsi, tetapi ia akan menunjukkan semua variasi nama negara, bukan hanya satu nama "biasa" yang saya mahukan. Selain itu, jika anda mengalih keluar .common, pautan penghala tidak akan berfungsi seperti yang ditunjukkan di bawah:

"TypeError: Tidak dapat membaca sifat yang tidak ditentukan (baca 'nama')" "Negara" harta atau kaedah tidak ditakrifkan pada contoh dan dirujuk semasa pemaparan."

Walaupun saya tidak mendapat ralat ini dengan pautan penghala tepat ini di tempat lain, dan "nama" tidak ditakrifkan dalam fail ini), satu-satunya cara saya mendapatkan pautan ke pautan penghala adalah dengan parameter ini:

(walaupun ia ' t memaut ke mana-mana kandungan (ia cuba memaut ke '/undefined?fullText=true')) { id: data.item._id }

P粉951914381P粉951914381234 hari yang lalu492

membalas semua(1)saya akan balas

  • P粉957661544

    P粉9576615442024-03-31 10:35:16

    Parameter pautan penghala hendaklah params: {country: data.item.name.official }}

    balas
    0
  • Batalbalas