Dieses Mal zeige ich Ihnen, wie Sie die geschweiften Klammern von Vue verwenden. Hier sind praktische Fälle sehen. .
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>{{}}的使用</title>
<script src="js/vue.js"></script>
</head>
<body>
<p id="container">
<h1>{{msg}}</h1>
<h4>{{cart.brand}}</h4>
<!--在双花括号中 执行运算表达式 -->
<p> 3 + 5 = {{ 3 + 5 }}</p>
</p>
<script>
new Vue({
el:"#container",
data:{
msg:"Hello VueJs",
cart:{
brand:"Volvo",price:30
}
}
})
</script>
</body>
</html><!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>双花括号的练习</title>
<script src="js/vue.js"></script>
</head>
<body>
<p>
双花括号:执行表达式,将表达式的结果 输出到当前调用的元素的innerHTML中
</p>
<p id="container">{{msg}}
<h4>三目运算3>5:{{3>5?"对":"错"}}</h4>
<h4>逻辑运算3>5 && 2>1:{{3>5 && 2>1}}</h4>
<h4>{{!hasMore}}</h4>
<h4>{{totalNum>count?"大于":"小于"}}</h4>
</p>
<script>
new Vue({
el:"#container",
data:{
msg:"Hello VueJs",
count:3,
totalNum:10,
hasMore:true
}
})
</script>
</body>
</html>Empfohlene Lektüre:
Detaillierte Erläuterung der SPA-Einzelseitenanwendung in VueParameter, die zwischen Vue-Router-Komponenten übergeben werden MethodeDas obige ist der detaillierte Inhalt vonSo verwenden Sie geschweifte Klammern in Vue. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
So ändern Sie den Dateityp in Win7
Computerbildschirm zeigt kein Signal
So exportieren Sie ein Projekt in PHPstorm
Kernelutil.dll-Fehlerreparaturmethode
Wörter verschwinden nach dem Tippen
Wort erzwungener Zeilenumbruch
Daten vom Android-Telefon auf das Apple-Telefon migrieren
So verwenden Sie mmplayer
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
