vue常用方法
#default="scope"
css 穿透
/* ::v-deep */
::v-deep .類名 {
}
子組件列表形式方法多加參數(shù)
@input="($event)=>{gorinput($event,item)}"
引入本地文件
require()
獲取原始數(shù)據(jù)
// 訪問初始值
this.$options.data().xx
dom 渲染后執(zhí)行
//dom渲染完執(zhí)行
this.$nextTick(() => {})
子組件調(diào)用父組件的事件
//調(diào)用父組件的事件
this.$parent.xx
父組件調(diào)用子組件的事件
// 子組件
<Foods ref="foods"></Foods>
// 調(diào)取
this.$refs.foods.show()
路由跳轉(zhuǎn)傳參
//跳轉(zhuǎn)時頁面
this.$router.push({
path: '/detail',
query: {
name: '張三',
id: 1,
}
})
//跳轉(zhuǎn)后頁面獲取參數(shù)對象
this.$route.query
// ---------------------------------------------------------------
//跳轉(zhuǎn)時頁面
this.$router.push({
name: 'Detail',
params: {
name: '張三',
id: 1,
}
})
//跳轉(zhuǎn)后頁面獲取參數(shù)對象
this.$route.params
// ---------------------------------------------------------------------
// 3. 直接跳轉(zhuǎn)(返回上一級或者往前一級)
router.go(1)//在瀏覽器記錄中前進(jìn)一步,
router.go(-1)// 后退一步記錄,等同于 history.back()
router.go(3)// 前進(jìn) 3 步記錄
發(fā)送驗(yàn)證碼
<el-button :disabled="codeDisabled" @click="sendVerification"
>{{send}}</el-button
>
<script>
data() {
return {
timer: null,
send: '獲取驗(yàn)證碼',
countdown: 60,
codeDisabled: false
}
},
// 發(fā)送驗(yàn)證
sendVerification() {
Passwordcode({
phone: this.Form.phone,
smsMsgType: 'FORGET_THE_PWD_TYPE'
}).then(res => {
this.codeDisabled = true
if (res.code == '200') {
if (!this.timer) {
this.timer = setInterval(() => {
if (this.countdown > 0 && this.countdown <= 60) {
this.countdown--
if (this.countdown !== 0) {
this.send = '重新發(fā)送(' + this.countdown + ')'
} else {
clearInterval(this.timer)
this.send = '獲取驗(yàn)證碼'
this.countdown = 60
this.timer = null
this.codeDisabled = false
}
}
}, 1000)
}
} else {
this.codeDisabled = false
this.$message({
message: res.errMsg,
type: 'warning'
})
}
})
}
</script>

浙公網(wǎng)安備 33010602011771號