VUE知识点总结---更新中

如何理解前端渲染？

把数据填充到HTML标签中，通过前端渲染，生成静态HTML内容

前端渲染方式

• 原生JS拼接字符串
• 使用前端模板引擎
• 使用vue模板语法

VUE模板语法

声明式渲染 / 编程

模板的结构和最终显示的效果基本一致

<div id="app">
  {
  { message }}
</div>

var app = new Vue({
   
  el: '#app',
  data: {
   
    message: 'Hello Vue!'
  }
})

1 差值表达式 { { }}

插值表达式存在的问题：“闪动”

使用v-cloak指令

解决该问题的原理：先隐藏，替换好值之后再显示最终的值

2 指令 v-

• 本质就是自定义属性

2.1 数据绑定指令

数据绑定：将数据填充到标签中

• v-text 填充纯文本

    相比插值表达式更加简洁
  

• v-html 填充HTML片段

    存在安全问题
    本网站内部数据可以使用，来自第三方的数据不可以用
  

• v-pre 填充原始信息

    显示原始信息，跳过编译过程（分析编译过程）
  

• v-once 只编译一次

    显示内容之后不再具有响应式功能
  

2.2 双向数据绑定指令

v-model指令用法

<input type='text' v-model='uname'/>

MVVM设计思想

	M(model)
	V(view)
	VM(View-Model)

3 事件绑定v-on

v-on指令用法

<input type=