一個vue頁面由三部分組成:1、template標簽包裹的界面展示代碼(HTML代碼);2、script標簽包裹的業務實現代碼(js腳本代碼);3、style標簽包裹的界面布局代碼(css樣式代碼)。
本教程操作環境:windows7系統、vue2.9.6版,DELL G3電腦。
vue頁面的構成
一個vue頁面主要分為三部分。
-
<template>界面展示代碼(需要注意的是只能有一個大的div)</template>
-
<script>export default {業務實現代碼}</script>
-
<style scoped >界面布局代碼(scoped 解決了css全局污染)</style>
HTML:template 中可以使用html標簽也有著element-ui vant-ui組件,這些組件更可視化。
js: script 中:有屬性 data components methods mounted computed 綁定的方法,以及生命周期8個等等。
css:scss less預處理等
vue全家桶
vue-cli + vue2.0 + vuex + vue-router + axios + element-ui
vue-cli 是快速搭建vue項目的腳手架。
vue 2.0 是vue.js是一套構建用戶界面的漸進式框架。vue 在2.0版本上引入了vdom。其vdom算法是基于snabbdom算法所做的修改。
vuex 的應用核心就是store(倉庫) ,“store” 基本上就是一個容器,它包含應用中大部分的狀態,vuex不是單純的全局對象,他是響應的,不能直接改變store中的狀態。需要顯示的提交
vue-router 是vue生態里面的路由工具,采用路由能輕松實現單頁面程序。
axios 是網絡請求方法。還有axios-jsonp 可以解決跨域問題。
element-ui 是一套為開發者、設計師和產品經理準備的基于vue2.0的桌面端組件庫。
【