如何在 vue js 中使用路由器链接？

Question

我是laravel-vue 的初学者，当我从数据库中获取数据以查看时，我遇到router-link 的问题，一切正常，但是当我将path 设置为路由器链接时，它没有工作。

错误是这样的：

无效的道具：道具“to”的类型检查失败。在 ---> RouterLink

中发现预期的字符串、对象未定义

这是我的模板代码：-

<template>
 <v-card>
   <v-card-title primary-title>
       <div>
           <h3 class="headline mb-0">
               <router-link :to="data.path">{{data.title}}</router-link>
           </h3>
           <div class="grey--text">
               {{data.created_at}}
           </div>
       </div>
   </v-card-title>
   <v-card-text>
      {{data.body}}
   </v-card-text>
 </v-card>
</template>

这是我的脚本：-

<script>

export default {
   props:['data']

}

这是我在里面读到的questions 的表单模板视图：-

<template>
<v-container fluid grid-list-md>
    <v-layout row wrap>
        <v-flex xs8>
            <question v-for="question in questions"
            :key="question.path"
            :data=question
            >

            </question>
        </v-flex>
        sidebar  
    </v-layout>
</v-container>
</template>

这是论坛脚本：-

<script>
import question from './question'
export default {
    data(){
        return{
            questions:{}
        }
    },
   components:{question},
    created(){
        axios.get('/api/question')
        .then(res=> this.questions = res.data.data)
        .catch(error=>console.log(error.response.data))
    }
}
</script>

Answer 1

Hello 是说它期望一个字符串或一个对象，但它收到了一个未定义的。 如何调试这个？ 你应该回到步骤

1.检查您访问的项目，也许控制台记录它： 这里看起来不错：to="data.path" 但数据可能为空或未定义
2。检查道具的变化：它没有改变
3。检查道具传递 :data=question aha !：问题出在这里我认为您在这里缺少引号

应该是:data="question"

<question v-for="question in questions"
            :key="question.path"
            :data="question"
            >

4.这将是您检查您的请求的地方 ...所以请务必使用控制台日志检查您的数据，它是如何格式化它包含的内容然后使用它，如果它没问题的话，你可能有一些语法问题