• <abbr id="chdyf"></abbr>
    <ruby id="chdyf"><acronym id="chdyf"><meter id="chdyf"></meter></acronym></ruby>
    <bdo id="chdyf"></bdo>
    <dfn id="chdyf"><menu id="chdyf"></menu></dfn>

    1. 

      <menuitem id="chdyf"></menuitem><strong id="chdyf"><menu id="chdyf"></menu></strong>
      <rt id="chdyf"><menu id="chdyf"></menu></rt>
      
成人小说一区二区三区,伊人精品成人久久综合全集观看,久久HEZYO色综合,中文字幕精品人妻熟女,影音先锋成人网站,我要看免费一级毛片,中国女人做爰A片,中文字幕av久久爽Av 
  
      
    

      

	
      
		
      
			
      
				
      Vue.js 學(xué)習(xí)日志（一）
      
				
      
					
       2019-7-4      seo達(dá)人      
      
					
					
      
						
					
      
				
      
				
			
      
			
      
				
      
    如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

      

      
    
      
<!DOCTYPE html>
      
<html>
      
<head>
      
 <meta charset="utf-8">
      
 <title>Vue 測(cè)試實(shí)例</title>
      
 <script src="../static/vue.min.js"></script>
      
</head>
      
<body>
      
 <div id="vue_data">
      
 <h1>title : {{title}}</h1>
      
 <h1>url : {{url}}</h1>
      
 <h1>{{info()}}</h1>
      
 </div>
      
 <script type="text/javascript">
      
 var vm = new Vue({
      
 el: '#vue_data',
      
 data: {
      
 title: "Vue.js",
      
 url: "https://cn.vuejs.org"
      
 },
      
 methods: {
      
 info: function() {
      
 return  this.title + " - 堅(jiān)持學(xué)習(xí)！";
      
 }
      
 }
      
 })
      
 </script>
      
</body>
      
</html>
      
1、每個(gè)Vue應(yīng)用都需要實(shí)例化Vue來(lái)實(shí)現(xiàn)
      

      
var vm = new Vue({
      
    //*******
      
})
      
2、el參數(shù)
      

      
在上面實(shí)例中的id為vue_data，在div元素中：
      

      
<div id="vue_data"></div>
      
意味著所有的改動(dòng)均在這個(gè)id為vau_data的div中，外部不受影響。
      

      
3、定義數(shù)據(jù)對(duì)象
      

      
data用于定義屬性，在上述實(shí)例中有2個(gè)屬性，分別為：title、url。
      

      
methods用于定義函數(shù)，可以通過(guò)return來(lái)返回函數(shù)值。
      

      
{{ }}用于輸出對(duì)象屬性和函數(shù)返回值。
      

      
當(dāng)一個(gè)Vue實(shí)例創(chuàng)建時(shí)，Vue的響應(yīng)系統(tǒng)加入了data對(duì)象中能找到的所有屬性。當(dāng)這些屬性的值發(fā)生改變時(shí)，html視圖也會(huì)產(chǎn)生相應(yīng)的變化。
      

      
<!DOCTYPE html>
      
<html>
      
<head>
      
 <meta charset="utf-8">
      
 <title>Vue 測(cè)試實(shí)例</title>
      
 <script src="../static/vue.min.js"></script>
      
</head>
      
<body>
      
 <div id="vue_data">
      
 <h1>title : {{title}}</h1>
      
 <h1>url : {{url}}</h1>
      
 </div>
      
 <script type="text/javascript">
      
 //數(shù)據(jù)對(duì)象
      
 var data = {title: "Vue.js",url: "https://cn.vuejs.org"}
      
 var vm = new Vue({
      
 el: '#vue_data',
      
 data: data
      
 })
      
 
      
 //設(shè)置屬性會(huì)影響到原始數(shù)據(jù)
      
 vm.title = "spring";
      
 document.write(data.title + "<br>");
      
 
      
 //同樣
      
 data.url = "https://spring.io";
      
 document.write(vm.url);
      
 </script>
      
</body>
      
</html>
      
Vue還提供了實(shí)例屬性與方法，以前綴$與用戶(hù)定義的屬性區(qū)分開(kāi)來(lái)。
      

      
document.write(vm.$data === data) // true
      

      
藍(lán)藍(lán)設(shè)計(jì)( www.wtxcl.cn )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。
      
      

      				
      
								
			
      
		
      
		
		
	
      


      
    
  
      
    
      日歷
      
    
      
        
      
        
    
      
  
      
    
    
      
      
      鏈接
      
      
        
                
      
    
      
    
      
      
      個(gè)人資料
      
      
    
      
    
      
      
      存檔