插值表达式语法：{{}}
使用时请注意以下几点：
插值表达式是vue框架提供的【指令】
插值表达式中 不可以写代码片段 会报错
属性节点中不能使用插值表达式，如果要为元素节点动态绑定数据，我们要用v-bind动态绑定属性（下篇文章讲）
代码演示：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><!-- 1.导入包 --><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body><!-- 2.添加id为app的div，将来要被vue控制--><div id="app"><!-- 注意 这是{{}} 其实是vue框架提供的【指令】 --><!-- {{}} 语法 叫做 插值表达式 --><p>{{msg}}</p> <hr><p>{{msg.length}}</p> <hr><p>{{msg + '~~~~~'}}</p> <hr><p>{{dlag ? '条件为真' : '条件为假'}}</p> <hr><!-- 插值表达式中 不可以写代码片段 会报错--><!-- <p>{{for(var i = 0 ; i < 5 ; i++){}}}</p> --><h1 title="hello">娃哈哈</h1><!-- 3.注意属性节点中不能使用插值表达式 --><!-- 如果要为元素节点动态绑定数据，我们要用其他方法 --><!-- <h1 title="{{msg}}">娃哈哈</h1> --></div><!-- 注意如果指令想要生效，必须放在vue控制的区域内 --><!-- <h1>{{msg}}</h1> --><script>// 3.创建vue实例对象，并指定要控制的页面区域const vm = new Vue({// VM 实例对象，会监听data中，每一项数据的变化，// 只要监听到了数据的改变，就会重新把el指定区域中的所有指令// 从新解析一遍el:'#app',// 要控制页面上的哪个区域data:{//表示页面上要渲染的数据msg:'我是geyao!',flag:true}})
</script></body>
</html>
