記錄自己的學(xué)習(xí)之旅吧，也算是一種變相的監(jiān)督自己杖狼，將自己的學(xué)習(xí)之路記錄下來炼蛤。
每次學(xué)完，寫下這些蝶涩，也算是一種復(fù)習(xí)理朋。
正片：
- v-on:click="click1"簡(jiǎn)寫@click="click1", 然后在方法里寫一個(gè)方法click1:function(){}其中寫上相應(yīng)的句式
2。顯示與隱藏绿聘。 有v-if 和v-show
1??v-if和v-else是想搭配的嗽上。它們必須相鄰 。 v-if是刪除view試圖的顯示與隱藏熄攘。刪除了view代碼兽愤。內(nèi)部的。可在wxml烹看。微信開發(fā)工具進(jìn)行驗(yàn)證查看
2??v-show 是視圖的顯示和隱藏国拇。但是不刪除代碼」呤猓可在wxml酱吝，進(jìn)行查看確認(rèn)
方法，計(jì)算數(shù)據(jù)和監(jiān)聽的區(qū)別及介紹：
1.methods 方法土思， computed 計(jì)算屬性 watch是監(jiān)聽
1??計(jì)算屬性和方法相同點(diǎn)是务热，如果方法內(nèi)值發(fā)生變化則會(huì)觸發(fā)。
2??不同點(diǎn)是當(dāng)與方法內(nèi)值不想干的值方式變化己儒，方法還是會(huì)觸發(fā)崎岂，計(jì)算屬性則不會(huì)觸發(fā)，因?yàn)橛芯彺?/p>
3??監(jiān)聽則是監(jiān)聽變量是否改變
例子：
<template>
<view>
<view class="" v-html="text2" :style="style0" v-on:click="click1"></view>
// 上面的點(diǎn)擊事件和上面的點(diǎn)擊事件是相同的闪湾。@click為簡(jiǎn)寫
<view class="" v-html="text2" :style="style0" @click="click1"></view>
<view class="" v-if="show"> hello </view>
<view class="" v-else> word </view>
<view class="" v-show="show"> show word </view>
<button class="" @click="click2"> 按鈕 </button>
<view class="">{{getValue()}}</view>
<view class="">{{getValue1}}</view>
<button @click="click3()">按鈕33</button>
<button @click="click4()">按鈕44</button>
</view>
</template>
<script>
export default {
data() {
return {
text2:'點(diǎn)擊事件',
style0:"font-size: 52px;color:yellow",
style1:"font-size: 52px;color:yellow",
style3:"font-size: 32px;color:red",
isClick:false
show : false
value:'log1',
value2:'log2',
value3:'log3'
}
},
methods: {
click1:function(){
if(this.isClick){
this.style0 = this.style1
this.isClick = false;
this.text2 = "測(cè)試點(diǎn)擊"+this.isClick
}else{
this.style0 = this.style3
this.isClick = true;
this.text2 = "測(cè)試點(diǎn)擊"+this.isClick
}
},
click2:function(){
this.show = this.show == true?false:true
},
click3:function(){
this.value2 = "log3"
},
click4:function(){
this.value = "log3"
},
getValue(){
console.log(" 方法觸發(fā)1")
return this.value;
}
},
computed:{
getValue1(){
console.log(" 方法觸發(fā)2");
return this.value;
}
}
watch:{
value2(){
console.log(" 監(jiān)聽觸發(fā)3");
this.value = this.value2 + this.value3
}
}
}
</script>
<style>
.text2{font-size: 22px; color:red;}
</style>
