【vue基础用法--内容渲染指令】

1.指令

一种模板语法，辅助开发者渲染页面的基本结构。

2.分类

 ① 内容渲染指令

② 属性绑定指令

③ 事件绑定指令

④ 双向绑定指令

⑤ 条件渲染指令

⑥ 列表渲染指令

3.内容渲染指令

辅助开发者渲染DOM里面的文本内容

1）v-text指令

v-text：内容渲染指令(可当作一个自定义属性使用）

使用实例：（将username的指渲染到p标签内部节点）

缺点：v-text指令会覆盖p标签中原本内容（即id=“app”中的原本内容），因此使用不多。

2）插值表达式

{{}}语法，专门用来解决v-text会覆盖默认文本内容的问题，在实际开发中用的很多。

优点：只起到占位符的作用，不覆盖原本内容。

3）v-html指令

作用：带有标签的字符串渲染成真正的html内容。

4）el属性使用细节

易错点：el属性直接指向p标签的处理方法是错误的，这样处理el只会处理第一个p标签，其余的不会被vue解析。

建议：el属性指向app的id，最外面 包一个大的div（id=“app”），让其直接控制div。