天天看點

vue系列——基礎知識

一、什麼是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 表達式作為一個指令的參數: