Question

我正在尝试使用模板文字本身实现类似于把手的东西。

这是我的代码：

let myTemplate = '<div class="tab" data-group="${id}">${name}</div>';

let doYourMagic = function(){
    let tabInfo = {
        id: 1234,
        name: "Alex"
    }

    let { id, name } =  tabInfo;

    console.log(myTemplate);
} )

现在，问题是，当我运行doYourMagic函数时，我得到：

<div class="tab" data-group="${id}">${name}</div>

但是，如果我在console.log中找到其中一个变量，我会得到正确的值（例如，console.log（name）会得到我的名字值。）

我想正确插入字符串，我做错了什么？

Answer 1

您必须使用此' theString '之类的模板文字符号，而不是使用` theString `声明字符串。

所以你的代码变成了：

let myTemplate = `<div class="tab" data-group="${id}">${name}</div>`;
//>  <div class="tab" data-group="1234">Alex</div>

您也可以将其简化为例如，这也可以完成工作：

let tabInfo = {
    id: 1234,
    name: "Alex"
};
console.log(`<div class="tab" data-group="${tabInfo.id}">${tabInfo.name}</div>`);

ES6中变量的插值

1 个答案: