- Vue.js核心技术解析与uni-app跨平台实战开发
- 袁龙
- 155字
- 2023-08-25 11:34:35
1.4 详解插值表达式
在1.3节中,我们使用插值表达式渲染了data中的msg数据,代码如下。
![](https://epubservercos.yuewen.com/F2C35D/26581507309218206/epubprivate/OEBPS/Images/Figure-P16_9378.jpg?sign=1739504603-xz3ONtr1I9GW0zjIDv3y92Ogo3Cj5Fa5-0-18235e161274ea2969910589805d3286)
上述代码中的msg的值是字符串,本节要讲的是,插值表达式不仅可以渲染字符串,还可以渲染对象、函数、运算符,代码如下。
![](https://epubservercos.yuewen.com/F2C35D/26581507309218206/epubprivate/OEBPS/Images/Figure-P17_9381.jpg?sign=1739504603-AQ3RBLAGjHxjfQodfJ1tfbfrJDEVgsrX-0-937aa83723a44ba6b4bb9018570f15b4)
运行结果如图1-2所示。
![](https://epubservercos.yuewen.com/F2C35D/26581507309218206/epubprivate/OEBPS/Images/Figure-P18_6988.jpg?sign=1739504603-MqZJ7DIHZyazEoddZ6ya6E9gopiXL3Ra-0-c16f232be4d263c4efeab92f7ebd9398)
图1-2 插值表达式的渲染结果
注意:
插值表达式不支持变量赋值、逻辑运算等,如下所示,代码的运行结果是错误的。
{{if(num>10){console.log('123')}}}