1、data
Vue 會遞回將 data 的屬性轉換為 getter/setter，從而讓 data 的屬性能夠回應資料變化，物件必須是純粹的物件 (含有零個或多個的 key/value 對)
data () {
return {
dataForm: {
xxx: ‘’,
xxx: 數字 //這里的數字會固定XXX的選項
},
xxx: [],
xxx: false,
xxx: 數字,
xxx: {}
}
}
2、components
呼叫其他組件
<template>
<div >
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
</div>
</template>
<script>
import AddOrUpdate from './bareapointinfo-add-or-update'
export default {
components: {
AddOrUpdate
}
}
</script>
3、methods
用來定義方法
methods: {
getDataList () {
this.dataListLoading = true
this.$http({
url: this.$http.adornUrl('/area/bareapointinfo/list'),
method: 'get',
params: this.$http.adornParams({
'page': this.pageIndex,
'limit': this.pageSize,
'pointName': this.dataForm.key
})
}).then(({data}) => {
if (data && data.code === 0) {
this.dataList = data.page.list
this.totalPage = data.page.totalCount
} else {
this.dataList = []
this.totalPage = 0
this.$message.error(data.msg)
}
this.dataListLoading = false
})
}
}
4、computed
當其依賴的屬性的值發生變化時，計算屬性會重新計算，反之，則使用快取中的屬性值，可以理解為為便簽設定屬性時呼叫
<div ref="truckGpsScreen" :style="{height:mainHeight + 'px'}">
</div>
computed: {
mainHeight: {
get () {
return this.$store.state.common.documentClientHeight - 50 - 40 - 32
}
}
}
5、mounted
進入頁面便開始呼叫，從頁面產生到消亡只會執行一次，可以用來加載初始化資料
mounted () {
if (screenfull.enabled) {
screenfull.on('change', this.onScreenFullChange)
}
this.initMap()
}
6、activated
keep-alive組件激活時呼叫（你可以理解為生命周期鉤子函式），只要切回到該頁面便呼叫一次
activated () {
this.timer = setInterval(this.getDataList, 3000)
}
7、deactivated
keep-alive組件停用時呼叫，只要切到別的頁面便呼叫一次
deactivated () {
clearInterval(this.timer)
}
8、beforeCreate
創建前的資料
9、created
創建完成的資料
本文轉自 https://blog.csdn.net/qq_38639813/article/details/121011091，如有侵權，請聯系洗掉，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/535225.html
標籤：其他
上一篇：5 分鐘速通 SVG