Vue.js中使用${}实现变量和字符串的拼接方式
作者：美奇开发工作室
这篇文章主要介绍了Vue.js中使用${}实现变量和字符串的拼接方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
使用${}实现变量和字符串的拼接
第1步、在data中定义变量（我定义的是comment对象）：
<script>
export default {
data() {
return {
comment: {
name: '张三',
content: '哈哈哈，Vue.js挺好用的。'
}
}
}
}
</script>第2步、在字符串中使用${}拼接变量
<template>
<li class="list-group-item">
<div class="handle">
<a href="javascript:;" rel="external nofollow" @click="del">删除</a>
</div>
<p class="name"><span>{{comment.name}}</span><span>说:</span></p>
<p class="content">{{comment.content}}</p>
</li>
</template>
<script>
export default {
data() {
return {
comment: {
name: '张三',
content: '哈哈哈，Vue.js挺好用的。'
}
}
},
methods: {
del() {
alert(this.comment.name);
if(window.confirm(`确定要删除${this.comment.name}的评论吗？`)) {
//这里省略实现删除的方法
}
}
}
}
</script>注意了 ：window.confirm()里不是单引号，而是两个 ` 号（esc下面的按键）。
在vue中实现字符串拼接为url连接
实现思路就是利用v-bind绑定属性，就可以在href属性中利用变量拼接出url
直接通过special_url+cls拼接出url。
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。