這個案列中詳述了:自定義按鍵修飾符,自定義指令,自定義過濾器
複習了v-model v-for
按鍵修飾符 .後加鍵 系統提供的有 enter,tab,delete,esc,space,up,down,left,right;
如果要用別的,則可以使用鍵盤碼(鍵盤上的每個鍵都對應乙個碼 比如113=f2),則是@keyup.113=「add」
如果不用碼則需要自定義按鍵修飾符,如本例中定義的f2 寫法是@keyup.f2=「add」
如果需要給keywords新增預設獲得焦點 但不用document.getelementbyid(「keywordtext」).focus(),則使用自定義指令,詳細用法看**
在案例**中還複習了@click.prevent事件修飾符
this.bandlist.foreach
this.bandlist.filter
this.bandlist.some
this.bandlist.findindex
this.bandlist.splice(id,1)
this.bandlist.push
這些用法
<
!doctype html>
"zh"
>
"utf-8"
>
"vue.js"
>
<
/script>
品牌列表<
/title>
<
/head>
<
!-- 這個案列中詳述了:自定義鍵盤修飾符,自定義指令,自定義過濾器 --
>
>
品牌列表<
/h3>
id"text" v-model=
"newid"
>
<
/label>
<
!-- 按鍵修飾符 .後加鍵 系統提供的有 enter,tab,
delete
,esc,space,up,down,left,right;
如果要用別的,則可以使用鍵盤碼(鍵盤上的每個鍵都對應乙個碼 比如113
=f2),則是@keyup.
113=
"add"
如果不用碼則需要自定義按鍵修飾符,如本例中定義的f2 寫法是@keyup.f2=
"add"
-->
name"text" v-model=
"newname" @keyup.f2=
"add"
>
<
/label>
"button" @click=
"add" value=
"新增品牌"
>
<
!-- 如果需要給keywords新增預設獲得焦點 但不用document.
getelementbyid
("keywordtext").
focus()
,則使用自定義指令--
>
<
!-- 如果v-color中不加''
,則 --
>
"text" v-model=
"keywords" id=
"keywordtext" v-focus v-color=
"'blue'" v-fontweight=
"900" v-fontsize=
"20"
>
<
/div>
"1">
索引<
/th>
id<
/th>
name<
/th>
ctime<
/th>
操作<
/th>
<
/tr>
<
/tr>
<
/tbody>
<
/table>
<
/div>
//這行**如果放在script的最上面則沒用,放在最下面則可以生效
'keywordtext').focus()
//不用上面的dom操作,使用自定義指令v-focus 定義的時候不用加v- ,這個自定義指令如果放在vm例項的後面,則載入頁面會報錯
//引數二是個物件,有一些鉤子函式,在特定的階段執行相關的操作
//這個也可以在vm例項中定義為私有指令
//和js行為有關的在inserted中執行,和樣式有關在bind執行
vue.
directive
("focus",,
inserted:
function
(el)
, updated:
function
(el)})
vue.
directive
("color",}
)//定義自定義鍵盤修飾符 鍵盤上的每個鍵都對應乙個碼 比如113==f2
vue.config.keycodes.f2 =
113//過濾器函式中的第乙個引數是固定的是源資料,後面的是引數,提高程式健壯性,可以使用es6 pattern = ''給乙個初始值
vue.
filter
("timeformat"
,function
(data , pattern ='')
-$-$
` //模板字串 es2015新增的符號
}else-$
-$$:
$:$`
}})var vm =
newvue(,
],newid:'',
newname:'',
keywords:''}
, methods:
this
.bandlist.
push
(car)},
research
(keywords)
// });
// return newlist
//方法二:使用filter 進行過濾
return
this
.bandlist.
filter
(item=>})
},del(id)
// })
//方法二:使用findindex查詢陣列中的元素索引,
// var index = this.bandlist.findindex(item=>
// })
// console.log(index)
// this.bandlist.splice(index,1)
//方法一和方法二是在id值唯一的情況下,如果id不唯一,則會出錯
//方法三:直接傳入索引值
this
.bandlist.
splice
(id,1)
}}, filters:-$
-$` }
else-$
-$$:
$:$----`
}}}, directives:},
//自定義指令的函式可以簡寫,這種寫法表示將bind和update上都是執行這個
'fontsize'
:function
(el,binding)}}
)<
/script>
<
/body>
<
/html>
JavaScript中涉及到的RegExp型別
正規表示式 由一些普通字元和特殊字元組成的,用以描述一種特定的字元規則的表示式,它是用來限制使用者在網際網路中輸入的規則 建立正規表示式 var 變數名 正規表示式的內容 修飾符 var reg 123456789 i var 變數名 new regexp 正規表示式的內容,修飾符 var reg ...
讀取網頁中涉及到的高度
目前已經總結的有 offsetheight offsettop clientheight clienttop scrollheight scrolltop innerheight outerheight將來準備看的有 有關控制滾動的該屬性是乙個唯讀屬性,返回乙個代表畫素高度的整數值,高度包括元素高度...
GPU設計中涉及到的座標
在gpu硬體處理以及opengl建模過程中都將設計到6種空間處理,直接構成了6種座標處理的環境 1 model space或者object space 這個空間是物件空間,與其他空間沒有關係,只是直接形成這個物體的具體輪廓以及其他屬性 attribute 物件的最終構成都是有vertex都成,由他的...