我在vue单个文件组件中收到此错误:
Errors compiling template:
invalid expression: Unexpected token { in
{{ jobs[0].build_link }}
Raw expression: v-bind:href="{{ jobs[0].build_link }}"
整行是:
<td :style=tdStyle><a v-bind:href="{{ jobs[0].build_link }}">{{ jobs[0].build_link }}</a></td>
jobs是在组件的data方法中定义的,我可以console.log此数据而不会出现问题。
也不知道为什么,但是这行代码可以与内联模板vue.js脚本一起正常工作,但是在转换为单个页面组件后会抛出此错误。
答案 0 :(得分:3)
我认为您有语法问题。请尝试不使用大括号。 例如:
<td :style=tdStyle><a v-bind:href="jobs[0].build_link">{{ jobs[0].build_link }}</a></td>
希望它能起作用。
答案 1 :(得分:1)
在这种情况下删除大括号是正确的,因为 v-bind 语法将评估表达式,但双大括号也会将其预先评估为字符串,因此您最终会尝试评估字符串。所以你本质上最终会得到类似 v-bind:href="https://google.com"
的东西,但 "https://google.com"
不是一个变量或表达式。有道理吗?