一、vue實例屬性gfhg
1.el獲取vue綁定的元素的领铐,可以對元素的style進行操作
2.data 獲取vue實例中的數(shù)據(jù)
3.options獲取vue實例中的自定義屬性
4.refs? ? 獲取所有帶ref屬性的元素
二、計算屬性
對于比較復(fù)雜的邏輯運算,都應(yīng)該使用計算屬性
例:
<div class="itany">
? ? <p>{{mag}}</p>
? ? <h1>{{list}}</h1>
? </div>
<script src="vue.js"></script>
<script>
new Vue({
? ? ? ? el:".itany",
? ? ? ? data:{
? ? ? ? ? ? mag:'hello Vue'
? ? ? ? },
? ? ? ? ? ? computed:{
? ? ? ? ? ? list:function(){
? ? ? ? ? ? ? ? return this.mag.split(' ').reverse().join('===');
? ? ? ? ? ? }
? ? ? ? }
? ? })
</script>
三状植、過濾器——保留兩位小數(shù)
<div class="itany">
? ? <p>{{1381.322165|addZero}}</p>
</div>
<script src="vue.js"></script>
<script>
//? ? ? ? 全局
? ? ? ? Vue.filter('addZero',function(data){
? ? ? ? ? ? return data.toFixed(2);
? ? ? ? })
? ? new Vue({
? ? ? ? el:'.itany'
//? ? ? ? ? ? 局部
//? ? ? ? ? ? filters:{
//? ? ? ? ? ? ? ? addZero:function(data){
//? ? ? ? ? ? ? ? ? ? return data.toFixed(2);
//? ? ? ? ? ? ? ? }
//? ? ? ? ? ? }
? ? })
四、過濾器——獲取時間
<div class="itany">
? ? <p>{{new Date()|houers}}</p>
</div>
<script src="vue.js"></script>
<script>
? ? new Vue({
? ? ? ? el:'.itany',
? ? ? ? ? el:'.itany',
? ? ? ? filters:{
? ? ? ? ? ? houers:function(data){?
? ? ? ? ? ? return data.getFullYear()+'年'+(data.getMonth()+1)+'月'+data.getDate()+'號,星期'+data.getDay()+";"+data.getHours()+'點'+data.getMinutes()+'分'+data.getSeconds()+'秒';
? ? }
? ? ? ? }
? ? })
</script>
計算屬性
對于比較復(fù)雜的邏輯運算,都應(yīng)該使用計算屬性津畸,以便于后期維護
例:
<!DOCTYPE html>
<html lang="en">
<head>
? ? <meta charset="UTF-8">
? ? <title>計算屬性1</title>
</head>
? <body>
<div class="itany">
<!--? ? ? 標(biāo)簽中-->
?? <h1>{{mes.split(' ').reverse().join('+++')}}</h1>
?? <!--? ? ?? 計算屬性-->
? <a href="#">{{app}}</a>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script>
new Vue({
? ? ? ? el:".itany",
? ? ? ? data:{
? ? ? ? ? ? mes:'Vue hello'
? ? ? ? ? ? ?? },
? ? ? ? computed:{
? ? ? ? ?? app:function(){
? ? ? ? ? ?? return this.mes.split(' ').reverse().join('+++');
? ? }
? ?? }
? })
? </script>
</body>
數(shù)組
string數(shù)組的定義有三種:
Stringarr[] =newString[10];//創(chuàng)建一個長度為10的String 類型數(shù)組振定。
Stringarr[] = {"張三","李四"};
String[] arr =newString[10];
join() 方法用于把數(shù)組中的所有元素放入一個字符串。
元素是通過指定的分隔符進行分隔的肉拓。
語法
arrayObject.join(separator)
concat() 方法用于連接兩個或多個數(shù)組后频。
該方法不會改變現(xiàn)有的數(shù)組,而僅僅會返回被連接數(shù)組的一個副本暖途。
語法
arrayObject.concat(arrayX,arrayX,......,arrayX)
slice() 方法可從已有的數(shù)組中返回選定的元素卑惜。
語法
arrayObject.slice(start,end)
Array.splice()方法是在數(shù)組中插入或刪除元素的通用方法。
不同于slice()和concat(),splice()會修改調(diào)用的元素數(shù)組驻售。
push() 方法可向數(shù)組的末尾添加一個或多個元素露久,并返回新的長度。
語法
arrayObject.push(newelement1,newelement2,....,newelementX)
unshift() 方法可向數(shù)組的開頭添加一個或更多元素欺栗,并返回新的長度毫痕。
語法
arrayObject.unshift(newelement1,newelement2,....,newelementX)
?reverse() 方法用于顛倒數(shù)組中元素的順序。
語法
arrayObject.reverse()
unshift() 方法可向數(shù)組的開頭添加一個或更多元素纸巷,并返回新的長度镇草。
語法
arrayObject.unshift(newelement1,newelement2,....,newelementX)
pop() 方法用于刪除并返回數(shù)組的最后一個元素眶痰。
語法
arrayObject.pop()