- Vue.js 2.x by Example
- Mike Street
- 110字
- 2021-07-02 20:00:26
Creating links using v-html
The next step is to link the email address so that it is clickable for users viewing the list of people. In this instance, we need to concatenate strings by adding a mailto: before the email address.
The first instinct is to do the following:
<a href="mailto:{{person.email}}">{{ person.email }}</a>
But Vue doesn't allow interpolation inside attributes. Instead, we must use the v-bind directive on the href attribute. This turns the attribute into a JavaScript variable, so any raw text must be written in quotes, and the concatenated with the desired variable:
<a v-bind:href="'mailto:' + person.email">{{ person.email }}</a>
Note the addition of v-bind:, the single quotes and concatenation + identifier.
推薦閱讀
- Java 開發(fā)從入門到精通(第2版)
- Android Studio Essentials
- Java Web開發(fā)之道
- Designing Hyper-V Solutions
- 機(jī)器人Python青少年編程開發(fā)實(shí)例
- Mastering RStudio:Develop,Communicate,and Collaborate with R
- Java:High-Performance Apps with Java 9
- Java編程的邏輯
- PHP編程基礎(chǔ)與實(shí)踐教程
- 大話Java:程序設(shè)計(jì)從入門到精通
- 案例式C語言程序設(shè)計(jì)實(shí)驗(yàn)指導(dǎo)
- IoT Projects with Bluetooth Low Energy
- Drupal Search Engine Optimization
- Java程序設(shè)計(jì)及應(yīng)用開發(fā)
- C#程序開發(fā)參考手冊(cè)