svelte - 为什么 svelte 将花括号放在标量上?
问题描述
例如,来自文档:
<canvas
width={32}
height={32}
></canvas>
花括号在这里有什么作用?
解决方案
在您展示的示例中,它没有任何区别。以下是等价的。
<canvas width={32} height={32}></canvas>
<canvas width="32" height="32"></canvas>
但是,使用花括号会导致 Svelte 将其解释为 JavaScript 表达式。这意味着您可以在花括号内进行数学运算...
<canvas width={32 + 8} height={32 - 8}></canvas>
...或将其换成变量。
<script>
let size = 40;
</script>
<canvas width={size} height={size}></canvas>
始终编写花括号意味着如果您想稍后使值动态化,它可以节省一些击键,但不会影响组件的呈现方式。
推荐阅读
- javascript - 带箭头函数的 setState 如何更改不在数组中的对象
- android - 如何在 Android 上动态更新 Azure Maps 图层?
- eslint - 如何使用 eslint-plugin-simple-import-sort 在 VSCode 中对导入进行排序?
- sql - SQL 日期范围规范,显式与 BETWEEN()
- java - Return top element in a stack
- visual-prolog - 有4个条件的支票号码
- c++ - 控制允许动态运行的并发动作的数量c c ++
- python - Issues in reading date column from csv in python
- http - 是否可以同时运行 http.ListenAndServe() AND ReadFromUDP() ?
- python - How do I store the absolute value of random numbers in a certain column of an array?