模板字符串的一些用法小记
1.插入变量:
使用 ${} 在模板字符串中插入变量的值。
const name = 'Alice'; const message = `Hello, ${name}!`; console.log(message); // 输出: "Hello, Alice!"html结构
2.表达式求值:
在 ${} 中可以执行任意的 JavaScript 表达式,并将其结果插入到模板字符串中。
const x = 3;const y = 4; const equation = `The result is ${x + y}`; console.log(equation); // 输出: "The result is 7"
3.多行字符串:
模板字符串允许换行符的存在,可以用于创建多行的字符串。
const message = ` Hello, World! `; console.log(message);// 输出:// "// Hello,// World!// "
4.嵌套模板字符串:
在一个模板字符串中嵌套另一个模板字符串。
const name = 'Alice';const greeting = `Welcome to our website, ${`Dear ${name}`}!`; console.log(greeting); // 输出: "Welcome to our website, Dear Alice!"
5.模板字符串在html结构用法
<span v-for="(item,i) in dataList" :key="i" @click="switchCom(item.id,i)" :class="{active:isActive == i,[`tab_icon_${i}`]:`tab_icon_${i}`}"> {{ item.title }} </span>