Complex Expressions — Literals & Template Literals

同学们，今天咱们来看LWC模板里一个很实用的特性——复杂表达式。你可以把它想象成在HTML中直接写JavaScript小片段的能力，它让我们的模板变得更聪明，能直接处理各种数据类型和运算。 首先，这些表达式能支持几乎所有基本的JavaScript字面量。你可以直接写字符串，用单引号或双引号包裹；写数字，不管是整数、小数，还是二进制、八进制、十六进制，甚至科学计数法的指数形式，都没问题。布尔值true和false当然也可以，还有空值null。这样一来，我们就省去了很多在控制器里预先定义变量的麻烦。 接着，特别要提的是模板文字。它用反引号把字符串包起来，里面可以用`${}`嵌入任何表达式。比如你想拼接一个问候语，可以直接写`你好，${userName}`，非常直观，不需要再写加号拼接了。而且，还有一种进阶用法叫标记的模板文字，它允许你把整个模板字符串传给一个函数去自定义处理，虽然日常开发中我们用得相对少，但知道有这回事就好。 再者，表达式还支持标识符和成员表达，也就是你可以直接从组件属性一路点下去，访问嵌套的属性，甚至调用方法，形成链式操作。比如直接写`record.name.toUpperCase()`，或者`list.length`，完全没问题，你不用在JS里专门弄一个getter来返回这些值。 总之，有了这些能力，以前我们为了在页面上显示一个计算结果，往往要单独写个getter方法，现在直接在模板里就能完成内联计算。代码简洁多了，也更易读。好了，关于复杂表达式这部分，我们就说到这儿，下节继续。