vue2中監(jiān)聽watch的寫法匯總

1

watch: {questionItem: {handler(val, oldVal) {if (val) {this.questionItem = JSON.parse(JSON.stringify(val))this.init()}},immediate: true, //刷新加載 立馬觸發(fā)一次handlerdeep: true // 可以深度檢測(cè),里面每個(gè)值改變都會(huì)通知數(shù)據(jù)更新。},},

• JSON.stringify()的作用是將 JavaScript 對(duì)象轉(zhuǎn)換為 JSON 字符串

• JSON.parse()可以將JSON字符串轉(zhuǎn)為一個(gè)對(duì)象。

2

<template><el-dialog:title="activeLayerId == 'fdb_poi_merge' ? '新建POI點(diǎn)' : '新增點(diǎn)門牌'"width="400px"> </el-dialog> </template><script> export default {props: ['tableData', 'isFilter', 'datalist'],// 寫法二props: {dialogWidth: {type: String,default: '300px'}, },data(){return{form: {adoptedFlag: '', //情報(bào)反饋 },style: {position: 'top',width: this.dialogWidth,},activeLayerId: '', //當(dāng)前圖層} },watch: {// 示例一'isFilter'(newVal) {if (newVal) {this.$refs.filterTable.clearSort(); // 清除排序this.$refs.filterTable.columnConfig.order = ''; // 清除排序高亮圖標(biāo)this.$emit('updateData', !newVal);}},// 示例二 datalist(newV) {this.nameList = newV;this.query_conditions = [new Condition('', '', '', '=', '', '')];},// 示例三'$store.state.editTask.activePanel'() {const obj = {intelligenceDetails: '情報(bào)詳情',infoList: '情報(bào)列表',};this.$emit('updateTitle', obj[this.$store.state.editTask.activePanel]);},// 示例四'form.adoptedFlag': function (val) {this.showReason = val !== 1;if (val !== 1) {this.form.denyReason = '';}}, // 示例五dialogWidth(newValue) {this.data.style.width = newValue;},// 示例六'$store.state.map.activeLayerId'() {this.$nextTick(() => {this.activeLayerId = this.$store.state.map.activeLayerId;});},// 示例七'$store.state.map.hideLeft'() {this.displayLeft();},}, } </script>

總結(jié)

以上是生活随笔為你收集整理的vue2中监听watch的写法汇总的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。