亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

cdn模式下vue的基本用法詳解

 更新時(shí)間:2018年10月07日 10:22:13   作者:jser_dimple  
這篇文章主要介紹了cdn模式下vue的基本用法,本文通過(guò)圖文并茂的形式給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友參考下吧

我們知道jq是簡(jiǎn)化了dom操作,而react和vue則是通過(guò)使用虛擬dom的方式,不需要頻繁的更改ui界面,而是通過(guò)更改數(shù)據(jù)的方式來(lái)更新界面。我們知道些jq插件時(shí)會(huì)在IFFE中傳入jQuery,jQuery在此程序中映射為符號(hào),這樣可以避免$號(hào)被其他庫(kù)覆寫(xiě)。其實(shí)vue中new Vue()對(duì)象,效果也是類(lèi)似,可以避免vue范圍類(lèi)的數(shù)據(jù)或變量被污染。我們先來(lái)看一些基本的用法插入文本值

v-html 直接插入html結(jié)構(gòu) 

 

v-bind屬性 <a :href="url" rel="external nofollow" > 

 

 v-if 

 

v-else 用作 v-if 的 else-if 塊??梢枣?zhǔn)降亩啻问褂?/p>

v-model v-model 指令用來(lái)在 input、select、text、checkbox、radio 等表單控件元素上創(chuàng)建雙向數(shù)據(jù)綁定,根據(jù)表單上的值,自動(dòng)更新綁定的元素的值。

v-on 按鈕的事件我們可以使用 v-on 監(jiān)聽(tīng)事件,并對(duì)用戶(hù)的輸入進(jìn)行響應(yīng)。 <a @click="doSomething">

v-show

Vue.js 允許你自定義過(guò)濾器,被用作一些常見(jiàn)的文本格式化。

v-for 數(shù)組

模板中使用 v-for

v-for 可以通過(guò)一個(gè)對(duì)象的屬性來(lái)迭代數(shù)據(jù)

computed與method 可以說(shuō)使用 computed 性能會(huì)更好,但是如果你不希望緩存,你可以使用 methods 屬性。

computed 屬性默認(rèn)只有 getter ,不過(guò)在需要時(shí)你也可以提供一個(gè) setter

$watch

style 在對(duì)象中傳入更多屬性用來(lái)動(dòng)態(tài)切換多個(gè) class

直接綁定到一個(gè)樣式對(duì)象,v-bind:style 可以使用數(shù)組將多個(gè)樣式對(duì)象應(yīng)用到一個(gè)元素上

事件

 

復(fù)選框

單選框

select 列表

組件組件(Component)是 Vue.js 最強(qiáng)大的功能之一。組件可以擴(kuò)展 HTML 元素,封裝可重用的代碼。全局組件所有實(shí)例都能用全局組件 

 

局部組件

prop 是父組件用來(lái)傳遞數(shù)據(jù)的一個(gè)自定義屬性。父組件的數(shù)據(jù)需要通過(guò) props 把數(shù)據(jù)傳給子組件,子組件需要顯式地用 props 選項(xiàng)聲明 "prop"

自定義事件父組件是使用 props 傳遞數(shù)據(jù)給子組件,但如果子組件要把數(shù)據(jù)傳遞回去,就需要使用自定義事件

Vue.js 路由允許我們通過(guò)不同的 URL 訪問(wèn)不同的內(nèi)容。

安裝

1、直接下載 / CDN https://unpkg.com/vue-router/dist/vue-router.js

2、NPM 推薦使用淘寶鏡像: cnpm install vue-router

Vue 在插入、更新或者移除 DOM 時(shí),提供多種不同方式的應(yīng)用過(guò)渡效果。 Vue 提供了內(nèi)置的過(guò)渡封裝組件,該組件用于包裹要實(shí)現(xiàn)過(guò)渡效果的組件。

mixin mixins就是定義一部分公共的方法或者計(jì)算屬性,然后混入到各個(gè)組件中使用,方便管理與統(tǒng)一修改。如果組件中定義的方法與混入對(duì)象中的方法/屬性一樣,組件中的優(yōu)先級(jí)大于混入對(duì)象中的(方法會(huì)調(diào)用多次)

Ajax Vue 要實(shí)現(xiàn)異步加載需要使用到 vue-resource 庫(kù) get請(qǐng)求

post 發(fā)送數(shù)據(jù)到后端,需要第三個(gè)參數(shù) {emulateJSON:true}。 emulateJSON 的作用: 如果Web服務(wù)器無(wú)法處理編碼為 application/json 的請(qǐng)求,你可以啟用 emulateJSON 選項(xiàng)。

本文升華自菜鳥(niǎo)教程vue模塊詳細(xì)的demo見(jiàn)我的 github: https://github.com/JserJser/reactWebApp/tree/master/vue-cdn

相關(guān)文章

最新評(píng)論