一、什么是Vuejs
Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。
1.功能
- 数据的渲染/数据的同步
- 组件化/模块化
- 路由,ajax,数据流
二、模板语法
1.v-once
v-once这个指令不需要任何表达式,它的作用就是定义它的元素或组件只会渲染一次,包括元素或者组件的所有字节点。首次渲染后,不再随着数据的改变而重新渲染。也就是说使用v-once,那么该块都将被视为静态内容。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="vue1.0.25.js" ></script>
</head>
<body>
<div id="app">
<p v-once>fgffd{{msg}}</p>
<p>对对对{{msg}}</p>
<input type="text" v-model="msg" name="" id="" value="" />
</div>
<script type="text/javascript">
new Vue({
el:'#app',
data:{
msg:'今天的天气很好'
}
})
</script>
</body>
</html>
这个指令在实际的业务场景中是很少使用的,只有我们想进一步去优化性能的时候,可能会用到。所以很多教程可能不会提及这个指令,这里也是让大家知道这个指令的基本用法。
5.v-bind:
从 2.6.0 开始,可以用方括号括起来的 JavaScript 表达式作为一个指令的参数:
<a v-bind:[attributeName]="url"> ... </a>