海投汇前端培训系列 -- Vue基础知识概览

海投汇前端培训

简单介绍Vue，详细文档请查看Vue官方文档

1、vue是什么

Vue是一个用于构建用户界面的渐进式JavaScript框架。Vue核心库只关注视图层。

2、声明式渲染

Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统

示例代码

// 实现一个hello world
// html

   hello {{ name }}


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

2、Vue指令

• （1）v-text
  作用：更新元素的textContent。
  示例：

  
  {{ msg }}
  

• （2）v-html
  作用：更新元素的innerHtml
  示例：

• （3）v-show
  作用：根据表达式之真假值，切换元素的 displayCSS 属性。
  示例：

• （4）v-if
  作用：根据表达式的值的真假条件渲染元素。在切换时元素及它的数据绑定 / 组件被销毁并重建。如果元素是