码迷,mamicode.com
首页 > 其他好文 > 详细

ES6 template string

时间:2017-04-01 13:22:59      阅读:123      评论:0      收藏:0      [点我收藏+]

标签:template   标识   div   out   span   html   log   写法   开始   

这个东西也是非常有用,当我们要插入大段的html内容到文档中时,传统的写法非常麻烦,所以之前我们通常会引用一些模板工具库,比如mustache等等。

大家可以先看下面一段代码:

$("#result").append(
  "There are <b>" + basket.count + "</b> " +
  "items in your basket, " +
  "<em>" + basket.onSale +
  "</em> are on sale!"
);

我们要用一堆的‘+‘号来连接文本与变量,而使用ES6的新特性模板字符串``后,我们可以直接这么来写:

$("#result").append(`
  There are <b>${basket.count}</b> items
   in your basket, <em>${basket.onSale}</em>
  are on sale!
`);

用反引号(`)来标识起始,用${}来引用变量,而且所有的空格和缩进都会被保留在输出之中,是不是非常爽?!

React Router从第1.0.3版开始也使用ES6语法了,比如这个例子:
<Link to={`/taco/${taco.name}`}>{taco.name}</Link>

ES6 template string

标签:template   标识   div   out   span   html   log   写法   开始   

原文地址:http://www.cnblogs.com/zero7room/p/6655570.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!