Vue.js模板字符串插值失效问题求助(Vue2环境)
问题解决办法
- 核心问题是模板字符串的引号用错了:JavaScript里的模板字符串需要用反引号(
)包裹,你当前用的是单引号('),所以${this.name}`不会被解析,直接原样输出。 - 另外你的代码存在语法错误:methods中
getFullName方法的闭合逻辑不对,多了一个冗余的括号,导致代码无法正常执行。
修正后的正确代码:
var app = new Vue({ el: "#app", data: { name: "Mike" }, methods: { getFullName() { return `Name: ${this.name}` } } })
替换引号后,${this.name}会被正确解析为data中的name值,调用getFullName方法会返回Name: Mike;同时修正语法错误后,代码能在控制台正常运行。
内容的提问来源于stack exchange,提问作者Marko LizZo
相关产品推荐
相关产品推荐

