Question

我无法在模板中访问用户的电子邮件。这就是我的所作所为：

Vue.component('officemates', {
    props: ['officemate'],
    template: '<li>{{ officemate.name }} | <a href="{{ officemate.website }}">{{ officemate.website }}</a></li>'
});

var officemates = new Vue({
    el: '#my-officemates',
    data: {
        myOfficeMates: [
            { name: 'Jolo Pedrocillo', website: 'https://www.oneman.com/' },
            { name: 'Lucel Del Campo', website: 'https://www.single-mom.com/' },
            { name: 'PJ Manahon', website: 'https://www.thebigone.com' },
            { name: 'Evan Ortega', website: 'https://www.goodguy.com' }
        ]
    }
})

当我检查渲染页面时，我可以看到列表，但链接是这样的：

http://localhost/dev_beta/vue/{{ officemate.website }}

我还在为下一个项目学习VueJS。我希望你能解决我的简单问题。

我使用的是Vue.js版本v2.1.10

：）

Answer 1

您必须使用v-bind：

<a v-bind:href="officemate.website">{{ officemate.website }}</a>

或简而言之，您也可以这样做：

<a :href="officemate.website">{{ officemate.website }}</a>

无法访问VueJS模板中的值

1 个答案: