diff --git a/source/_posts/en/tutorial/if.md b/source/_posts/en/tutorial/if.md index 397e85d..c63275c 100644 --- a/source/_posts/en/tutorial/if.md +++ b/source/_posts/en/tutorial/if.md @@ -1,5 +1,5 @@ --- -title: 条件 +title: Conditional Rendering categories: - tutorial --- @@ -8,35 +8,35 @@ categories: s-if ------ -通过 **s-if** 指令,我们可以为元素指定条件。当条件成立时元素可见,当条件不成立时元素不存在。 +**s-if** directive can be used for conditional rendering. The element will be rendered if and only if the condition evaluates to true. -`提示`:当不满足条件时,San 会将元素从当前页面中移除,而不是隐藏。 +`Note`: The element will be removed rather than hidden when the condition is not satisfied. ```html Hello San! ``` -**s-if** 指令的值可以是任何类型的[表达式](../template/#表达式)。 +The **s-if** directive can contain any type of [expression](../template/#Expression). ```html Hello San! ``` -`提示`:San 的条件判断不是严格的 === false。所以,一切 JavaScript 的假值都会认为条件不成立:0、空字符串、null、undefined、NaN等。 +`Note`:All JavaScript falsy values are considered false: 0, empty string, null, undefined, NaN, etc. s-elif ------ `> 3.2.3` -**s-elif** 指令可以给 **s-if** 增加一个额外条件分支块。**s-elif** 指令的值可以是任何类型的[表达式](../template/#表达式)。 +**s-elif** directive can be used to add a condition branch for **s-if**. The **s-elif** directive can contain any type of [expression](../template/#Expression). ```html Active Pending ``` -`提示`:**s-elif** 指令元素必须跟在 **s-if** 或 **s-elif** 指令元素后,否则将抛出 **elif not match if** 的异常。 +`Note`:**s-elif** element must immediately follow a **s-if** or **s-elif** element. An **elif not match if** exception will be thrown if used otherwise. s-else-if @@ -44,7 +44,7 @@ s-else-if `> 3.5.6` -**s-else-if** 指令是 **s-elif** 指令的别名,效果相同。 +**s-else-if** directive is an alias for **s-elif** directive, they're effectively the same. ```html Active @@ -55,20 +55,20 @@ s-else-if s-else ------ -**s-else** 指令可以给 **s-if** 增加一个不满足条件的分支块。**s-else** 指令没有值。 +**s-else** directive can be used to specify a condition-not-satisfied branch for **s-if**. **s-else** have no value. ```html Hello! Offline ``` -`提示`:**s-else** 指令元素必须跟在 **s-if** 或 **s-elif** 指令元素后,否则将抛出 **else not match if** 的异常。 +`Note`:**s-else** element must immediately follow a **s-if** or **s-elif** element. An **else not match if** exception will be thrown if used otherwise. -虚拟元素 +Virtual Element ------ -在 san 中,template 元素在渲染时不会包含自身,只会渲染其内容。对 template 元素应用 if 指令能够让多个元素同时根据条件渲染视图,可以省掉一层不必要的父元素。 +In san templates, only contents of **template** are rendered, NOT including the **template** element itself. By applying an **if** directive for **template** element, multiple elements (without a redundant parent element) can be rendered regarding to the **if** condition. ```html