Vue入坑總結
阿新 • • 發佈:2018-06-14
webp efault div 分享圖片 ges 推薦 bsp ret info
一、require(‘../assets/1.jpg‘) 圖片通過js引入到項目中,使用require為了使webpack返回正確的資源路徑
二、使用Router
第一步:router配置
//使用router第一步:router配置 import Router from ‘vue-router‘
第二步:註冊router
//使用router第二步:router註冊 Vue.use(Router)
第三部:router的map
import IndexPage from ‘../pages/IndexPage‘ export default new Router({ //router的map routes: [ { path: ‘/‘, name: ‘IndexPage‘, component: IndexPage } ] })
三、創建任何組件,
1、先建 .vue單文件 2、引入組件 import slideShow from ‘../components/Slide‘ 3、註冊組件 components
四、學會使用計算屬性
有時候使用方法也可以實現,但是更多的使用計算屬性
computed:{ //最開始想到的是用方法實現效果,但是推薦計算屬性, preIndex:function(){ if(this.newIndex==0){ return this.slides.length-1 }else{ return this.newIndex-1 } } }
計算屬性是基於它們的依賴進行緩存的。計算屬性只有在它的相關依賴發生改變時才會重新求值。方法不會緩存
Vue入坑總結