RIOT.JS - 条件
条件是用于显示/隐藏 RIOT 标签元素的构造。以下是 RIOT 支持的三个条件 −
if − 根据传递的值添加/删除元素。
<custom2Tag>
<h2 if = {showMessage}>Using if!</h2>
<script>
this.showMessage = true;
</script>
</custom2Tag>
show − 如果传递 true，则使用 style ="display:' ' "显示元素。
<custom2Tag>
<h2 show = {showMessage}>Using show!</h2>
<script>
this.showMessage = true;
</script>
</custom2Tag>
hide 如果传递 true，− 会使用 style = "display:'none' " 隐藏元素。
<custom2Tag>
<h2 show = {showMessage}>Using show!</h2>
<script>
this.showMessage = true;
</script>
</custom2Tag>
示例
以下是完整示例。
custom2Tag.tag
<custom2Tag>
<h2 if = {showMessage}>Using if!</h2>
<h2 if = {show}>Welcome!</h1>
<h2 show = {showMessage}>Using show!</h2>
<h2 hide = {show}>Using hide!</h2>
<script>
this.showMessage = true;
this.show = false;
</script>
</custom2Tag>
custom2.htm
<!DOCTYPE html>
<html>
<head>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/riot/3.13.2/riot+compiler.min.js"></script>
</head>
<body>
<custom2Tag></custom2Tag>
<script src = "custom2Tag.tag" type = "riot/tag"></script>
<script>
riot.mount("custom2Tag");
</script>
</body>
</html>
这将产生以下结果 −
