vue基本腳手架
常用的方法
methods: {} => 方法處理
mounted(){} => dom 載入前之前執行
computed: {} => 計算屬性
components: {} => 元件註冊
filters:{} => 過濾器註冊
watch:{} =>資料監聽 不常用
data:{} =>vue 將會遞迴將 data 的屬性轉換為 getter/setter
props {} =>可以是陣列或物件,用於接收來自父元件的資料
指令
v-for => v-for="item in data"
}v-model
=> 資料繫結, 資料同步用
v-bind => 資料繫結用 簡寫(:sryle="")
v-on => 資料監聽,繫結方法 簡寫(@clack="")
v-if
=> 資料判斷 true/false
v-show =>樣式控制顯隱 true/false
v-html => 遍歷html 標籤的一種形式
ref => ref="dom" 獲取dom this.$refs.dom
路由
路由的註冊
import vue from 'vue';
import router from 'vue-router';
vue.use(router);
export default new router(, ]
},, ,]})
多級頁面在此中在新增一次
路由的傳慘
隱藏key連線形式傳慘
var url = "/goods/"+"引數";
this.$router.push(url);
路由註冊中心 path: '/goods/id', 按此配置
接收引數
this.$route.params.id
get形式傳慘
this.$router.push(
});接收引數
this.$route.query.paytype;
元件的傳慘
//元件傳參
:data="list"
子元件觸發父子的事件
@gat="orderlist"
list:
orderlist()
//元件引用
import vmenu from '../../common/menu'
//元件祖冊
components:
子元件//元件接收引數
props: ,
官方文件
參考文獻:
vue2 0 router和 route的區別
在vue2.0裡頁面引數是 this.route.query或者 this.route.params 接收router link傳的引數。在路由跳轉的時候除了用router link標籤以外需要在script標籤在事件裡面跳轉,所以有個方法就是在script標籤裡面寫this.router.push...
vue2 0 router和 route的區別
做專案的時候發現傳引數是通過this.route.query或者this.route.params接收 router link 傳的引數。方式1 使用 a 標籤 跳轉 或者是 router link 方式2 使用 window.location.href 的形式,叫做程式設計式導航 簡單說就是寫js...
vue路由router的基本使用
路由 路由是乙個js功能模組,用於解決spa專案元件切換顯示問題的,本身對元件切換的各個底層技術有做封裝,是更成熟元件切換解決方案,使用起來更高階 方便。路由是開發spa專案的必備技能。路由封裝的元素有 路由實現 在專案中安裝路由有兩種方式 兩種方式本質完全一樣 vuecli 腳手架 建立專案的時候...