当前位置： 移动技术网 > IT编程>脚本编程>vue.js > Vue学习笔记（二）

Vue学习笔记（二）

2020年07月17日  | 移动技术网IT编程  | 我要评论

1 插值操作

1.1 Mustache语法

Mustache ：双大括号 {{}}

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>Title</title>
	</head>
	<body>
		<div id = "app">
			<h1>{{message}}</h1>
			<!--mustache语法中，不仅仅可以直接写变量，也可以写简单的表达式-->
			<h2>{{first + second}}</h2>
			<h2>{{first + ' ' + second}}</h2>
			<h2>{{first}} {{second}}</h2>
			<h2>{{counter * 2}}</h2>
		</div>
		
		<script type="text/javascript" src="js/vue.min.js" ></script>
		<script>
			const app = new Vue({
				el:'#app',
				data:{
					message:'你好，大哥',
					first:'床前明月光',
					second:'疑是地上霜',
					counter:100
				}
			})
		</script>
	</body>
</html>

解析：mustache语法中，不仅可以直接写变量，还可以写简单的表达式。

1.2 其他指令

① v-once ：该指令后面不需要跟任何表达式。该指令表示元素和组件只渲染一次，不会随着数据的改变而改变。

② v-html ：该指令后面往往会跟上一个string类型，会将string的html解析出来并且进行渲染。

③ v-text：通常情况下，后面接一个string类型，不建议使用。

④ v-pre

⑤ v-cloak

本文地址：https://blog.csdn.net/weixin_43574277/article/details/107339423

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网