vuevue2.0vue

vue2.0vuexvue-routeraxioswebpackeslintbetter-scroll

chrome

• star

vuevue-cli,webpack

• PostCsschromecsscss
• Eslint-.-
• bableES2015ES6.bableES6ES5
• StylusSASS/SCSS{}
• ...

vue-clinode

vuereactangular vueHTMLCSSJS

Axios

vue1.xvueHTTPvue-resourcevue2.0axios

resaxiosjsonres.data

axios.get(url).then((res)=>{
  this.data = res.data
})

Vuex

vuevuexangularfactoryservice

const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment(state) {
      state.count++
    }
  }
})

Vue-Router

vue-routervuerouterappview

router.push('test')

vue2.0v-elrefref

<div ref="testHook">test</div>
...js code
this.$ref.testHook

ref

<test ref="testHook"></test>
...js code
this.$ref.testHook.add() //testadd

emit

vue2

test:

export default {
  method:{
  	click(){
  	  Vue.$emit('add',{}) //
  	}
  }
}

testcreated

export default {
  created(){
   Vue.$on('add',this.add)
  },
  method:{
  	add(){
  	  this.count++
  	}
  }
}

vueGitHubstar Hah

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

• QQ745913574

• QQ149683643

• WeChat

vue1.0vue2.0vuexvue-router